:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#eaf6ff;background:#04111f}*{box-sizing:border-box}html,body{margin:0;min-height:100%;width:100%;background:#04111f;color:#eaf6ff}body{overflow-x:hidden}.shell{width:100%;min-height:100vh;background:linear-gradient(180deg,#061525 0%,#04111f 100%);overflow:hidden}.panel-line{border:1px solid rgba(22,164,220,.34);border-radius:7px;box-shadow:inset 0 0 0 1px rgba(5,16,34,.035)}.header{height:58px;display:grid;grid-template-columns:minmax(195px,.95fr) 86px minmax(360px,1.75fr) minmax(205px,.95fr) 120px 112px 100px;align-items:center;gap:6px;padding:3px 12px;background:linear-gradient(180deg,#08223b,#07172a)}.brand{display:flex;align-items:center;gap:10px;min-width:0}.logo-mark{width:38px;height:40px;display:grid;place-items:center;font-size:30px;color:#2ddcff;filter:drop-shadow(0 0 8px #007dff);transform:scaleX(1.05);flex:0 0 auto}.brand-name{font-size:22px;font-weight:900;letter-spacing:-1px;white-space:nowrap}.brand-name span{color:#188cff}.brand-sub{font-size:8px;letter-spacing:.42em;text-align:center;margin-top:1px}.onair{background:linear-gradient(#ff4a63,#e72748);border:2px solid #ff9aaa;border-radius:6px;color:#05070c;font-size:17px;font-weight:900;padding:5px 4px;text-align:center;box-shadow:0 0 14px rgba(255,51,89,.2);line-height:1.05}.master-vu{align-self:stretch;display:flex;flex-direction:column;justify-content:center;min-width:0}.vu-row{display:grid;grid-template-columns:18px 1fr;gap:5px;align-items:center;font-size:15px}.vu-bars,.mini-vu{height:12px;border-radius:2px;background:repeating-linear-gradient(90deg,#1fe8ff 0 5px,transparent 5px 8px);position:relative;overflow:hidden;box-shadow:0 0 7px rgba(18,219,255,.12)}.vu-bars:after,.mini-vu:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(18,238,255,.18) 0 56%,rgba(161,245,92,.6) 56% 70%,rgba(255,220,55,.95) 70% 84%,rgba(255,55,83,.95) 84%);mix-blend-mode:screen}.scale{display:none}.datetime{text-align:center;min-width:0}.datetime>div{font-size:9px;color:#eef7ff;white-space:nowrap}.datetime strong{display:block;font-family:monospace;font-size:31px;line-height:1;color:#18d9ff;text-shadow:0 0 10px rgba(0,213,255,.3)}.weather{display:flex;align-items:center;justify-content:center;gap:6px}.cloud{font-size:25px}.weather small,.weather span{display:block;text-align:center;font-size:9px}.weather strong{display:block;color:#18d9ff;font-size:19px;white-space:nowrap}.status-block{text-align:center;min-width:0}.status-block small{display:block;font-size:9px}.status-block strong{display:block;color:#13dbff;margin:3px 0 1px;font-size:10px;white-space:nowrap}.status-block i{display:inline-block;width:10px;height:10px;background:#20e8ff;border-radius:50%;box-shadow:0 0 8px rgba(32,232,255,.45)}.status-block span{font-size:8px;white-space:nowrap}.nav{height:50px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;background:#051522}.nav button{height:100%;border:0;background:transparent;color:#e9f5ff;font-size:12px;padding:0 8px;display:flex;align-items:center;gap:6px;cursor:pointer;white-space:nowrap}.nav button:first-letter{color:#1ddcff}.nav button.active,.nav button:hover{background:rgba(0,157,255,.05);color:#46ddff}.workspace{display:grid;grid-template-columns:minmax(0,47%) 40px minmax(0,1fr);gap:8px;padding:8px 10px 0;align-items:stretch}.left,.right{min-width:0}.left{padding:10px;background:linear-gradient(180deg,#061a2c,#041423);min-height:680px}.now{display:grid;grid-template-columns:72px minmax(0,1fr) 168px;gap:8px;align-items:center}.cover{width:72px;height:76px;border-radius:7px;background:linear-gradient(135deg,#0b79ff,#15d6ff);display:grid;place-items:center;font-size:38px;color:#dffcff;box-shadow:0 0 16px rgba(0,160,255,.12)}.track-info{min-width:0}.track-info small{font-size:9px;font-weight:800;letter-spacing:.11em}.track-info h2{margin:3px 0 1px;font-size:16px;font-weight:500;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-info h3{margin:0;font-size:13px;font-weight:500;white-space:nowrap}.track-info p{margin:3px 0 0;font-size:11px}.timebox{border-left:1px solid rgba(7,24,48,.22);padding-left:10px;min-width:0}.timebox small{color:#43ff6d;font-weight:900;font-size:10px}.timebox>strong{display:block;font-family:monospace;font-size:34px;line-height:1;color:#16e4ff;text-align:center;text-shadow:0 0 10px rgba(0,218,255,.35);white-space:nowrap}.time-meta{display:grid;grid-template-columns:repeat(3,1fr);margin-top:5px}.time-meta span{font-size:7px;text-align:center;border-right:1px solid rgba(8,28,55,.24);white-space:nowrap}.time-meta span:last-child{border-right:0}.time-meta b{display:block;color:#18dcff;font-family:monospace;font-size:11px;margin-top:2px}.seek{display:grid;grid-template-columns:38px 1fr 38px;align-items:center;gap:5px;margin:4px 0 5px;font-family:monospace;font-weight:800;font-size:12px}.seekbar{height:10px;border-radius:7px;background:#07335b;overflow:hidden}.seekbar div{height:100%;width:38%;background:linear-gradient(90deg,#1deaf0,#007bff)}.transport{display:grid;gap:5px;margin-bottom:6px;border-top:1px solid rgba(7,22,44,.18);padding-top:5px}.transport-main{grid-template-columns:repeat(6,1fr)}.transport button{height:34px;border:0;background:transparent;color:#19dfff;font-size:26px;font-weight:900;text-shadow:0 0 8px rgba(0,175,255,.45);cursor:pointer;border-radius:5px}.transport button:hover,.transport button.active{background:rgba(10,54,92,.28)}.playlist-head{display:grid;grid-template-columns:78px minmax(0,1.25fr) minmax(0,1fr) 58px 36px;font-size:9px;font-weight:800;border-top:1px solid rgba(7,22,44,.18);padding:6px 2px 4px}.playlist{display:flex;flex-direction:column;gap:3px}.row{display:grid;grid-template-columns:58px 18px 23px minmax(0,1.28fr) minmax(0,1fr) 50px 30px;align-items:center;min-height:28px;font-size:10px;min-width:0}.row>time{font-family:monospace;font-weight:800;white-space:nowrap}.row>strong,.row>span,.row>em,.row>b{padding:5px 5px;background:#0a7ad1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row>strong{font-weight:700}.row>em{font-style:normal;font-family:monospace;font-weight:800;text-align:center}.row button{height:28px;border:1px solid rgba(23,218,255,.55);border-radius:5px;background:#062846;color:#27ddff;padding:0;font-size:13px;box-shadow:inset 0 0 0 1px rgba(23,218,255,.06)}.row.yellow>strong,.row.yellow>span,.row.yellow>em,.row.yellow>b{background:#ffe645;color:#111}.row.red>strong,.row.red>span,.row.red>em,.row.red>b{background:#f43d5d}.row.green>strong,.row.green>span,.row.green>em,.row.green>b{background:#43d889;color:#062319}.state{width:17px;height:17px;border:2px solid #e9f7ff;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:9px}.state.ok{border-color:#25f760;color:#25f760}.state.playing{border-color:#1fe6ff;color:#1fe6ff}.toolstrip{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:11px}.toolstrip button{width:36px;height:36px;border:0;background:transparent;color:#13dfff;font-size:23px;text-shadow:0 0 7px rgba(0,140,255,.48)}.right{display:flex;flex-direction:column;gap:8px}.mini-players{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.mini{padding:8px 10px 8px;background:#061728;min-width:0}.mini-vu{height:11px;margin-bottom:6px}.mini-controls{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;border-top:1px solid rgba(7,22,44,.16);padding-top:5px}.mini-controls button{height:30px;border:0;background:transparent;color:#18ddff;border-radius:4px;font-size:17px;text-shadow:0 0 7px rgba(0,177,255,.45);padding:0}.mini-controls button:hover,.mini-controls button.active{background:rgba(10,54,92,.28)}.mini-progress{height:9px;border-radius:7px;background:#07376a;margin-top:5px;overflow:hidden}.mini-progress i{display:block;height:100%;background:linear-gradient(90deg,#12e8ef,#076cff)}.pads-panel{padding:8px;background:#051727;flex:1}.pads{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(6,66px);gap:6px}.pads button{min-height:0;height:100%;border-radius:7px;border:1px solid rgba(7,22,44,.2);background:linear-gradient(135deg,#75def8,#8cd9f0);color:#08101b;font-size:10px;font-weight:800;text-align:left;padding:7px 8px;cursor:pointer;overflow:hidden}.pads button small{display:block;font-size:10px;margin-top:2px}.pads button.cyan{background:linear-gradient(135deg,#22f1ed,#15cddd)}.pads button.yellow{background:linear-gradient(135deg,#fff24d,#ffd33f)}.pads button.red{background:linear-gradient(135deg,#ff425d,#f32852);color:#fff}.pads button:active{transform:translateY(1px);filter:brightness(.92)}.taskbar{height:44px;margin-top:7px;border-top:1px solid rgba(7,22,44,.18);background:#061525;display:flex;align-items:center;justify-content:center;position:relative}.task-icons{display:flex;gap:18px;align-items:center;font-size:20px}.task-icons span:first-child{color:#16d5ff}.task-status{position:absolute;right:12px;display:grid;grid-template-columns:repeat(4,auto) 48px;gap:8px;align-items:center;font-size:10px}.task-status strong{grid-row:1}.task-status small{grid-column:5;grid-row:2;margin-top:-6px}.task-status span{grid-row:1 / span 2}.flash{animation:flash .45s ease}@keyframes flash{50%{filter:brightness(1.45);text-shadow:0 0 12px #16dfff}}
@media(min-width:1350px){.header{grid-template-columns:235px 96px 430px minmax(220px,1fr) 135px 120px 105px;padding:3px 14px}.brand-name{font-size:25px}.datetime strong{font-size:34px}.workspace{grid-template-columns:minmax(0,48%) 48px minmax(0,1fr);gap:10px;padding:10px 14px 0}.left{padding:12px}.now{grid-template-columns:82px minmax(0,1fr) 205px;gap:10px}.cover{width:82px;height:86px;font-size:44px}.track-info h2{font-size:18px}.track-info h3{font-size:14px}.timebox>strong{font-size:40px}.time-meta b{font-size:13px}.row{grid-template-columns:76px 22px 28px minmax(0,1.3fr) minmax(0,1fr) 66px 38px;font-size:11px;min-height:30px}.playlist-head{grid-template-columns:110px minmax(0,1.25fr) minmax(0,1fr) 76px 46px;font-size:10px}.pads button{font-size:11px}.pads button small{font-size:11px}.mini-controls button{height:30px;font-size:19px}}
@media(max-width:900px){.header{grid-template-columns:155px 66px 250px 1fr 95px 82px 74px;gap:4px;padding:2px 7px;height:54px}.brand-name{font-size:20px}.brand-sub{font-size:8px}.logo-mark{width:36px;height:42px;font-size:26px}.onair{font-size:18px;padding:7px 5px}.datetime strong{font-size:32px}.datetime>div{font-size:9px}.weather strong{font-size:20px}.nav{height:52px;padding:0 6px}.nav button{font-size:10px;padding:0 5px;gap:4px}.workspace{grid-template-columns:minmax(0,47%) 34px minmax(0,1fr);gap:6px;padding:6px 7px 0}.left{padding:8px}.now{grid-template-columns:82px minmax(0,1fr) 180px;gap:8px}.cover{width:82px;height:86px;font-size:44px}.track-info h2{font-size:18px}.track-info h3{font-size:14px}.timebox>strong{font-size:40px}.time-meta span{font-size:7px}.time-meta b{font-size:12px}.transport button{font-size:20px}.pads{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(6,56px);gap:5px}.pads button{font-size:10px;padding:6px}.pads button small{font-size:10px}.taskbar{height:40px}}

.nav button svg{width:21px;height:21px;fill:none;stroke:#19dfff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px rgba(25,223,255,.28));flex:0 0 auto}
.nav button.active svg,.nav button:hover svg{stroke:#43e8ff}

.mini-title{font-size:11px;font-weight:700;letter-spacing:.04em;margin:0 0 3px 1px;color:#eaf6ff}

.toolstrip button{display:grid;place-items:center}
.toolstrip button svg{width:27px;height:27px;fill:none;stroke:#13dfff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px rgba(19,223,255,.3))}
.pads-title{font-size:13px;letter-spacing:.03em;margin:0 0 6px 2px;color:#eef7ff}

/* Tela do Ar: layout fechado, sem rolagem */
html,body{height:100%;overflow:hidden}
.shell{height:100vh;min-height:0;overflow:hidden;display:flex;flex-direction:column}
.header{flex:0 0 54px;height:54px}
.nav{flex:0 0 44px;height:44px}
.workspace{flex:1 1 auto;min-height:0;height:auto;overflow:hidden;align-items:stretch;padding:6px 8px 0;grid-template-columns:minmax(0,48%) 34px minmax(0,1fr);gap:7px}
.left,.right{height:100%;min-height:0;overflow:hidden}
.left{display:flex;flex-direction:column;min-height:0;padding:8px}
.now,.seek,.transport,.playlist-head{flex:0 0 auto}
.playlist{flex:1 1 auto;min-height:0;overflow:hidden;gap:2px}
.now{grid-template-columns:66px minmax(0,1fr) 152px;gap:7px}
.cover{width:66px;height:70px;font-size:34px}
.track-info h2{font-size:15px}
.track-info h3{font-size:12px}
.track-info p{font-size:10px}
.timebox>strong{font-size:30px}
.time-meta b{font-size:10px}
.seek{margin:3px 0 4px}
.transport{margin-bottom:4px;padding-top:4px}
.transport button{height:28px;font-size:23px}
.playlist-head{padding:4px 2px 3px}
.row{min-height:24px;font-size:9px}
.row>strong,.row>span,.row>em,.row>b{padding:4px 4px}
.row button{height:24px;font-size:11px}
.right{display:flex;flex-direction:column;gap:6px}
.mini-players{flex:0 0 auto;gap:6px}
.mini{padding:5px 7px}
.mini-title{font-size:10px;margin-bottom:2px}
.mini-vu{height:8px;margin-bottom:3px}
.mini-controls{padding-top:3px}
.mini-controls button{height:22px;font-size:15px}
.mini-progress{height:6px;margin-top:3px}
.pads-panel{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;overflow:hidden;padding:6px}
.pads-title{flex:0 0 auto;margin:0 0 5px 2px;font-size:12px}
.pads{flex:1 1 auto;min-height:0;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(6,minmax(0,1fr));gap:5px}
.pads button{min-height:0;height:100%;padding:5px 6px;font-size:9px}
.pads button small{font-size:9px}
.toolstrip{gap:7px;overflow:hidden}
.toolstrip button{width:30px;height:30px}
.toolstrip button svg{width:22px;height:22px}
.taskbar{flex:0 0 34px;height:34px;margin-top:0}

/* ajuste final iPad: garantir 6x6 inteira dentro do viewport */
.workspace{padding-top:4px}
.left{padding:6px}
.now{grid-template-columns:62px minmax(0,1fr) 142px;gap:6px}
.cover{width:62px;height:64px;font-size:31px}
.track-info small{font-size:8px}
.track-info h2{font-size:14px}
.track-info h3{font-size:11px}
.track-info p{font-size:9px}
.timebox>strong{font-size:27px}
.time-meta span{font-size:6px}
.time-meta b{font-size:9px}
.seek{margin:2px 0 3px}
.transport{margin-bottom:3px;padding-top:3px}
.transport button{height:25px;font-size:21px}
.playlist-head{padding:3px 2px 2px}
.row{min-height:22px;font-size:8.5px}
.row>strong,.row>span,.row>em,.row>b{padding:3px 4px}
.row button{height:22px;font-size:10px}
.mini{padding:4px 6px}
.mini-title{font-size:9px}
.mini-vu{height:7px;margin-bottom:2px}
.mini-controls button{height:19px;font-size:14px}
.mini-progress{height:5px;margin-top:2px}
.right{gap:4px}
.pads-panel{padding:5px}
.pads-title{margin-bottom:4px;font-size:11px}
.pads{gap:4px}
.pads button{padding:4px 5px;font-size:8.5px}
.pads button small{font-size:8.5px}
.toolstrip{gap:5px}
.toolstrip button{width:27px;height:27px}
.toolstrip button svg{width:20px;height:20px}
.taskbar{flex-basis:28px;height:28px}
.task-icons{font-size:16px;gap:14px}
.task-status{font-size:9px}

/* alinhamento final da Tela do Ar — iPad/desktop, sem rolagem */
html,body{
  width:100%;
  height:100%;
  min-height:100%;
  overflow:hidden;
}
body{
  height:100dvh;
}
.shell{
  width:100%;
  height:100dvh;
  min-height:0;
  max-height:100dvh;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.header{
  flex:0 0 56px;
  height:56px;
  min-height:56px;
  padding:3px 12px;
}
.nav{
  flex:0 0 46px;
  height:46px;
  min-height:46px;
}
.workspace{
  flex:1 1 auto;
  min-height:0;
  height:auto;
  overflow:hidden;
  padding:6px 8px;
  grid-template-columns:minmax(0,48%) 36px minmax(0,1fr);
  gap:8px;
  align-items:stretch;
}
.left,.right,.toolstrip{
  min-height:0;
  height:100%;
  overflow:hidden;
}
.left{
  display:flex;
  flex-direction:column;
  padding:7px;
}
.now{
  flex:0 0 auto;
  grid-template-columns:68px minmax(0,1fr) 158px;
  gap:8px;
}
.cover{
  width:68px;
  height:70px;
  font-size:34px;
}
.track-info small{font-size:8.5px}
.track-info h2{font-size:15px}
.track-info h3{font-size:12px}
.track-info p{font-size:10px}
.timebox>strong{font-size:30px}
.time-meta span{font-size:6.5px}
.time-meta b{font-size:10px}
.seek{
  flex:0 0 auto;
  margin:3px 0 4px;
}
.transport{
  flex:0 0 auto;
  margin-bottom:4px;
  padding-top:4px;
}
.transport button{
  height:28px;
  font-size:23px;
}
.playlist-head{
  flex:0 0 auto;
  padding:4px 2px 3px;
}
.playlist{
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
  gap:2px;
}
.row{
  min-height:24px;
  font-size:9px;
}
.row>strong,.row>span,.row>em,.row>b{
  padding:4px 4px;
}
.row button{
  height:24px;
  font-size:11px;
}
.toolstrip{
  justify-content:center;
  gap:7px;
}
.toolstrip button{
  width:30px;
  height:30px;
}
.toolstrip button svg{
  width:22px;
  height:22px;
}
.right{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.mini-players{
  flex:0 0 auto;
  gap:6px;
}
.mini{
  padding:5px 7px;
}
.mini-title{
  font-size:10px;
  margin-bottom:2px;
}
.mini-vu{
  height:8px;
  margin-bottom:3px;
}
.mini-controls{
  padding-top:3px;
}
.mini-controls button{
  height:22px;
  font-size:15px;
}
.mini-progress{
  height:6px;
  margin-top:3px;
}
.pads-panel{
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  padding:6px;
}
.pads-title{
  flex:0 0 auto;
  margin:0 0 5px 2px;
  font-size:12px;
}
.pads{
  flex:1 1 auto;
  min-height:0;
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  grid-template-rows:repeat(6,minmax(0,1fr));
  gap:5px;
}
.pads button{
  min-width:0;
  min-height:0;
  width:100%;
  height:100%;
  padding:5px 6px;
  font-size:9px;
}
.pads button small{
  font-size:9px;
}
.taskbar{
  flex:0 0 30px;
  height:30px;
  min-height:30px;
  margin-top:0;
}
.task-icons{
  font-size:16px;
  gap:14px;
}
.task-status{
  font-size:9px;
}

/* lista de áudio: 12 itens visíveis e sem título da botoneira */
.playlist{
  flex:1 1 auto;
  min-height:0;
}
.row{
  min-height:22px;
}
.row>strong,.row>span,.row>em,.row>b{
  padding-top:3px;
  padding-bottom:3px;
}
.row button{
  height:22px;
}
.pads-panel{
  padding-top:5px;
}

/* ajuste da lista de áudio: mais alta e com respiro nas extremidades */
.playlist-head{
  margin-top:4px;
}
.playlist{
  flex:1 1 auto;
  min-height:0;
  margin-top:3px;
  margin-bottom:4px;
  padding:2px 0;
}
.row{
  min-height:23px;
}
.left{
  padding-bottom:8px;
}

/* correção solicitada: lista de áudio realmente mais alta e separada das extremidades */
.left{
  padding:7px 10px 10px 10px;
}
.playlist-head{
  margin-top:8px;
  margin-left:4px;
  margin-right:4px;
}
.playlist{
  flex:1 1 auto;
  min-height:0;
  margin:5px 4px 8px 4px;
  padding:4px 0 6px 0;
}
.row{
  min-height:25px;
}
.row>strong,.row>span,.row>em,.row>b{
  padding-top:4px;
  padding-bottom:4px;
}
.row button{
  height:25px;
}

/* lista de áudio: quinas arredondadas e respiro entre status e CUE */
.playlist{
  border-radius:9px;
  overflow:hidden;
}
.state{
  margin-right:5px;
}
.row button{
  margin-left:5px;
}


/* correção: respiro interno no lado oposto ao CUE */
.playlist,
.playlist-head{
  margin-left:4px;
  margin-right:4px;
}
.row>time{
  padding-left:6px;
}
.playlist-head>span:first-child,
.playlist-head>div:first-child{
  padding-left:6px;
}

/* ajuste exato: espaço entre a bolinha de status e o início da faixa colorida */
.row>b{
  margin-left:7px;
}

/* somente a faixa colorida mais alta */
.row>strong,.row>span,.row>em,.row>b{padding-top:6px;padding-bottom:6px}

/* faixa colorida: um pouco mais grossa e com quinas arredondadas */
.row>strong,.row>span,.row>em,.row>b{padding-top:7px;padding-bottom:7px}
.row>b{border-radius:6px 0 0 6px}
.row>em{border-radius:0 6px 6px 0}

/* aumentar somente o espaço vertical entre as faixas coloridas */
.playlist{gap:5px}

/* controles principais — opção 1 aprovada: ícones soltos ciano, sem caixa */
.transport-main{
  grid-template-columns:repeat(8,1fr);
  align-items:center;
}
.transport-main button{
  height:34px;
  min-width:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent !important;
  box-shadow:none !important;
  color:#19dfff;
  display:grid;
  place-items:center;
  cursor:pointer;
}
.transport-main button:hover,
.transport-main button.active{
  background:transparent !important;
  box-shadow:none !important;
}
.transport-main button svg{
  width:27px;
  height:27px;
  fill:none;
  stroke:#19dfff;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:drop-shadow(0 0 5px rgba(25,223,255,.34));
}

/* estados dos controles principais */
.transport-main button.flash svg{
  stroke:#ffd84d;
  filter:drop-shadow(0 0 6px rgba(255,216,77,.45));
}
.transport-main #loopBtn.active svg{
  stroke:#ff9f1a;
  filter:drop-shadow(0 0 6px rgba(255,159,26,.45));
}

/* CUE aprovado — opção 3: fone + texto CUE em ciano, caixa discreta arredondada */
.row .cue-btn{
  margin-left:5px;
  height:25px;
  min-width:46px;
  padding:0 5px;
  border:1px solid #19dfff;
  border-radius:5px;
  background:transparent;
  color:#19dfff;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:3px;
  box-shadow:0 0 6px rgba(25,223,255,.16);
}
.row .cue-btn svg{
  width:13px;
  height:13px;
  fill:none;
  stroke:#19dfff;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:drop-shadow(0 0 3px rgba(25,223,255,.28));
}
.row .cue-btn span{
  font-size:7px;
  line-height:1;
  font-weight:700;
  letter-spacing:.2px;
}

/* CUE final aprovado: quadrado ciano com fone maior e sem texto */
.row .cue-btn{
  width:25px;
  min-width:25px;
  height:25px;
  padding:0;
  gap:0;
}
.row .cue-btn svg{
  width:18px;
  height:18px;
}
.row .cue-btn span{
  display:none;
}

/* barra superior: alinhamento refinado sem alterar conteúdo */
.header{
  grid-template-columns:minmax(190px,1fr) 82px minmax(320px,1.8fr) minmax(185px,.95fr) 112px 106px 96px;
  gap:8px;
  align-items:center;
}
.header>*{
  min-width:0;
  align-self:center;
}
.brand{
  height:100%;
  display:flex;
  align-items:center;
}
.onair{
  width:100%;
  box-sizing:border-box;
  align-self:center;
  margin:0;
}
.master-vu{
  height:100%;
  align-self:center;
  justify-content:center;
}
.datetime,
.weather,
.status-block{
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  box-sizing:border-box;
}
.weather{
  flex-direction:row;
}
.datetime>div,
.datetime strong,
.weather small,
.weather strong,
.weather span,
.status-block small,
.status-block strong,
.status-block span{
  margin-left:auto;
  margin-right:auto;
}

/* logo PlayMaster Studio fornecida pelo usuário */
.brand{
  overflow:visible;
}
.brand-logo{
  display:block;
  width:176px;
  max-width:100%;
  height:48px;
  object-fit:contain;
  overflow:visible;
}

/* ajuste solicitado: logo e aviso NO AR um pouco mais à esquerda */
.brand-logo{
  transform:translateX(-6px);
}
.onair{
  transform:translateX(-8px);
}

/* ajuste solicitado: campo principal do player um pouco mais à direita */
.left{
  transform:translateX(4px);
}


/* Fade Out — ícone aprovado, sem texto, antes do Loop */
.transport-main #fadeOutBtn svg{
  width:24px;
  height:24px;
}
.transport-main #fadeOutBtn svg path:nth-child(2){
  stroke-width:2.15;
}
.transport-main #fadeOutBtn svg path:nth-child(3){
  stroke-width:2.05;
}

/* Prévia aprovada: separadores discretos, controles alinhados e identificação azul. */
.nav,.toolstrip{border:0;box-shadow:none}
.transport-main{
  grid-template-columns:repeat(8,minmax(0,1fr));
  column-gap:0;
  align-items:center;
}
.transport-main button{justify-self:stretch}
.mini-title{
  display:flex;
  align-items:center;
  height:21px;
  margin:0 0 2px;
  border-radius:3px;
  overflow:hidden;
  background:#063e9d;
  color:#eaf6ff;
  letter-spacing:0;
  font-weight:500;
}
.mini-badge{
  display:grid;
  place-items:center;
  align-self:stretch;
  flex:0 0 27px;
  background:#087dff;
  color:#fff;
  font-size:10px;
  font-weight:800;
}
.mini-track{
  padding:0 5px;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* redeploy-approved-preview-2026-09-18 */


/* acabamento visual do preview aprovado — 2026-09-18 */
:root{
  --studio-line:rgba(17,104,143,.78);
  --studio-line-soft:rgba(13,82,116,.58);
  --studio-cyan:#19dfff;
}

/* linhas e divisórias mais nítidas, mantendo o azul-petróleo do preview */
.panel-line{
  border:1px solid var(--studio-line);
  box-shadow:
    inset 0 0 0 1px rgba(2,18,30,.62),
    0 0 7px rgba(0,126,168,.08);
}
.header{
  border-color:var(--studio-line);
}
.left,
.mini,
.pads-panel{
  border-color:var(--studio-line);
}
.mini{
  box-shadow:
    inset 0 0 0 1px rgba(2,18,30,.58),
    0 0 5px rgba(0,126,168,.06);
}

/* menu superior aprovado: Home ativo sem bloco/linha envolvendo */
.nav button.active{
  background:transparent !important;
  box-shadow:none !important;
  color:#46ddff;
}
.nav button:hover{
  background:rgba(0,157,255,.035);
}

/* atalhos centrais sem caixas, com presença ciano semelhante ao preview */
.toolstrip button{
  border:0 !important;
  outline:0;
  background:transparent !important;
  box-shadow:none !important;
}
.toolstrip button svg{
  stroke:#18e0ff;
  stroke-width:2;
  filter:drop-shadow(0 0 5px rgba(24,224,255,.26));
}

/* controles principais: alinhamento uniforme e brilho discreto */
.transport-main{
  justify-items:center;
}
.transport-main button{
  justify-self:stretch;
}
.transport-main button svg{
  filter:drop-shadow(0 0 5px rgba(25,223,255,.28));
}
.transport-main #fadeOutBtn svg{
  width:25px;
  height:25px;
}

/* lista: contorno dos botões laterais mais próximo do preview */
.row .cue-btn{
  border-color:rgba(25,223,255,.78);
  box-shadow:
    inset 0 0 0 1px rgba(4,40,57,.3),
    0 0 5px rgba(25,223,255,.08);
}

/* botoneira: contorno escuro mais definido e separação visual */
.pads button{
  border:1px solid rgba(2,24,35,.88);
  box-shadow:
    inset 0 0 0 1px rgba(22,164,220,.10),
    0 0 2px rgba(0,0,0,.28);
}

/* barras e cabeçalhos dos P1/P2/P3 com azul do preview */
.mini-title{
  border:1px solid rgba(17,104,143,.55);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.24);
}
.mini-badge{
  background:#087dff;
}
.mini-progress{
  box-shadow:inset 0 0 0 1px rgba(17,104,143,.30);
}

/* separação do player principal e da botoneira */
.seekbar{
  box-shadow:inset 0 0 0 1px rgba(17,104,143,.30);
}


/* playlist action menu preview */
.playlist-actions{
  position:fixed;
  z-index:120;
  display:flex;
  align-items:center;
  gap:4px;
  padding:5px 7px;
  min-height:38px;
  border:1px solid rgba(54,203,255,.68);
  border-radius:22px;
  background:linear-gradient(180deg,rgba(18,72,101,.97),rgba(5,38,59,.98));
  box-shadow:0 8px 24px rgba(0,0,0,.32),0 0 12px rgba(18,213,255,.12),inset 0 1px 0 rgba(255,255,255,.10);
  backdrop-filter:blur(10px);
}
.playlist-actions[hidden]{display:none}
.playlist-actions button{
  width:31px;
  height:31px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#eaf8ff;
  cursor:pointer;
}
.playlist-actions button:hover,
.playlist-actions button:focus-visible{
  background:rgba(33,198,255,.14);
  outline:none;
}
.playlist-actions svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.playlist-actions [data-action="delete"]{color:#ff6577}
.playlist-actions .active-action{
  color:#ffd84d;
  animation:playlistActionBlink .85s steps(2,end) infinite;
}
.playlist-actions .cue-action-active{color:#ff9f1a}

@keyframes playlistActionBlink{
  50%{opacity:.32;filter:drop-shadow(0 0 7px currentColor)}
}
@keyframes controlBlinkYellow{
  50%{opacity:.35;filter:drop-shadow(0 0 8px #ffd84d)}
}
.transport-main button.blink-yellow svg{
  stroke:#ffd84d !important;
  animation:controlBlinkYellow .82s steps(2,end) infinite;
}
.transport-main #loopBtn.blink-yellow svg{
  stroke:#ffd84d !important;
}
.row.loop-row{
  box-shadow:inset 0 0 0 1px rgba(255,216,77,.72),0 0 7px rgba(255,216,77,.12);
}
.row .cue-btn.cue-active{
  color:#ff9f1a;
  border-color:#ff9f1a;
  box-shadow:0 0 8px rgba(255,159,26,.22);
}
.row .cue-btn.cue-active svg{
  stroke:#ff9f1a;
  filter:drop-shadow(0 0 4px rgba(255,159,26,.35));
}
.library-view{
  flex:1 1 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:7px;
  overflow:hidden;
  padding:3px;
}
.library-view[hidden]{display:none}
.library-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:5px 6px 4px;
  border-bottom:1px solid rgba(22,164,220,.34);
}
.library-head>div{
  min-width:0;
  display:flex;
  flex-direction:column;
}
.library-head strong{
  font-size:12px;
  color:#eaf6ff;
}
.library-head small{
  font-size:8px;
  color:#8fb4c9;
}
.library-close{
  flex:0 0 28px;
  width:28px;
  height:28px;
  border:1px solid rgba(25,223,255,.35);
  border-radius:7px;
  background:#061b2d;
  color:#19dfff;
  font-size:21px;
  line-height:1;
}
.library-search input{
  width:100%;
  height:31px;
  border:1px solid rgba(25,223,255,.32);
  border-radius:7px;
  background:#041827;
  color:#eaf6ff;
  padding:0 10px;
  font:inherit;
  font-size:10px;
  outline:none;
}
.library-search input:focus{border-color:#19dfff}
.library-list{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  display:flex;
  flex-direction:column;
  gap:5px;
  padding-right:2px;
}
.library-item{
  min-height:42px !important;
  height:auto !important;
  display:grid !important;
  grid-template-columns:28px minmax(0,1fr) 45px !important;
  align-items:center;
  gap:7px;
  padding:5px 8px !important;
  border:1px solid rgba(17,104,143,.55) !important;
  border-radius:7px !important;
  background:linear-gradient(180deg,#08243a,#061a2d) !important;
  color:#eaf6ff !important;
  text-align:left !important;
}
.library-item:hover{
  border-color:rgba(25,223,255,.75) !important;
  background:linear-gradient(180deg,#0a3150,#08213a) !important;
}
.library-item>b{
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  border-radius:5px;
  background:#087dff;
  color:#fff;
}
.library-item>span{
  min-width:0;
  display:flex;
  flex-direction:column;
}
.library-item strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:10px;
}
.library-item small{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#8fb4c9;
  font-size:8px;
}
.library-item em{
  font-style:normal;
  font-size:9px;
  color:#bcecff;
  text-align:right;
}


/* traffic library states */
.library-status{
  flex:0 0 auto;
  min-height:20px;
  padding:3px 7px;
  border-radius:5px;
  background:rgba(8,42,65,.72);
  color:#8fdfff;
  font-size:8.5px;
}
.library-status.error{
  background:rgba(94,24,36,.45);
  color:#ff9cab;
}
.library-empty{
  padding:14px 10px;
  border:1px dashed rgba(25,223,255,.24);
  border-radius:7px;
  color:#8fb4c9;
  font-size:9px;
  text-align:center;
}

/* deploy-approved-playlist-actions-traffic-integration-2026-09-18 */


/* library shortcut toolbar */
.toolstrip .library-shortcut{
  position:relative;
}
.toolstrip .library-shortcut.active svg{
  stroke:#ffd84d;
  filter:drop-shadow(0 0 6px rgba(255,216,77,.35));
}
.toolstrip .library-shortcut.active::after{
  content:'';
  position:absolute;
  right:0;
  width:2px;
  height:15px;
  border-radius:2px;
  background:#ffd84d;
  box-shadow:0 0 5px rgba(255,216,77,.35);
}

/* deploy-library-shortcuts-2026-09-18 */


/* audio library operational layout */
/* atalhos mais próximos do topo */
.toolstrip{
  justify-content:flex-start !important;
  padding-top:4px;
}

/* ao abrir uma pasta, a botoneira some e a biblioteca ocupa o painel desde o topo */
.pads-panel.library-open{
  padding:0 !important;
}
.pads-panel.library-open .library-view{
  width:100%;
  height:100%;
  padding:0;
  gap:5px;
}
.pads-panel.library-open .library-head{
  padding:4px 6px;
  margin:0;
}
.pads-panel.library-open .library-search,
.pads-panel.library-open .library-status,
.pads-panel.library-open .library-list{
  margin-left:5px;
  margin-right:5px;
}

/* seleção da faixa principal que receberá o próximo áudio */
.playlist .row.selected-row{
  outline:1px solid rgba(255,216,77,.9);
  outline-offset:-1px;
  border-radius:6px;
  box-shadow:0 0 7px rgba(255,216,77,.16);
}
.playlist .row.drag-target{
  outline:2px solid #19dfff;
  outline-offset:-2px;
  box-shadow:0 0 10px rgba(25,223,255,.28);
}

/* linhas da biblioteca com menu de três pontos */
.library-item{
  min-height:42px !important;
  height:auto !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 34px !important;
  gap:0 !important;
  padding:0 !important;
  overflow:hidden;
}
.library-item.selected{
  border-color:rgba(255,216,77,.75) !important;
  box-shadow:inset 0 0 0 1px rgba(255,216,77,.14);
}
.library-item.dragging{
  opacity:.55;
}
.library-item-main{
  min-width:0;
  width:100%;
  min-height:40px;
  display:grid;
  grid-template-columns:28px minmax(0,1fr) 54px;
  align-items:center;
  gap:7px;
  padding:5px 7px;
  border:0;
  background:transparent;
  color:#eaf6ff;
  text-align:left;
  cursor:pointer;
  overflow:hidden;
}
.library-item-main>b{
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  border-radius:5px;
  background:#087dff;
  color:#fff;
}
.library-item-main>span{
  min-width:0;
  display:flex;
  flex-direction:column;
}
.library-item-main strong,
.library-item-main small{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.library-item-main strong{font-size:10px}
.library-item-main small{font-size:8px;color:#8fb4c9}
.library-item-main em{
  min-width:0;
  font-style:normal;
  font-size:9px;
  color:#bcecff;
  text-align:right;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  pointer-events:none;
}
.library-more{
  position:relative;
  z-index:5;
  width:34px;
  min-width:34px;
  min-height:40px;
  padding:0;
  border:0;
  border-left:1px solid rgba(17,104,143,.38);
  background:transparent;
  color:#19dfff;
  font-size:17px;
  font-weight:800;
  line-height:1;
  letter-spacing:1px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.library-more:hover,
.library-more:focus-visible{
  background:rgba(25,223,255,.08);
  outline:none;
}
.library-item-actions{
  grid-column:1 / -1;
  padding:5px 7px 7px;
  border-top:1px solid rgba(17,104,143,.28);
  background:rgba(3,20,34,.62);
}
.library-item-actions[hidden]{display:none !important}
.library-add{
  width:100%;
  min-height:30px;
  border:1px solid rgba(25,223,255,.55);
  border-radius:6px;
  background:rgba(9,72,101,.46);
  color:#dff9ff;
  font-size:9px;
  font-weight:700;
  cursor:pointer;
}
.library-add:hover,
.library-add:focus-visible{
  border-color:#19dfff;
  background:rgba(12,92,128,.62);
  outline:none;
}


/* real main player states */
.playlist-empty{
  flex:1 1 auto;
  min-height:72px;
  display:grid;
  place-items:center;
  padding:18px 12px;
  border:1px dashed rgba(25,223,255,.24);
  border-radius:8px;
  color:#7897aa;
  font-size:9px;
  text-align:center;
  background:rgba(3,17,28,.22);
}
.seekbar{
  cursor:pointer;
  touch-action:manipulation;
}
.transport-main #fadeOutBtn.blink-yellow svg{
  stroke:#ffd84d !important;
  animation:controlBlinkYellow .82s steps(2,end) infinite;
}
.row .state:not(.playing){
  transition:color .15s ease;
}


/* touch and mouse audio drag fix */
.library-item-main{
  touch-action:pan-y;
  -webkit-user-select:none;
  user-select:none;
}
.library-item.selected{
  border-color:#ffd84d !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,216,77,.20),
    0 0 8px rgba(255,216,77,.12);
}
.library-item.selected .library-more{
  color:#ffd84d;
}
.library-drag-ghost{
  position:fixed;
  z-index:300;
  pointer-events:none;
  max-width:230px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:7px 10px;
  border:1px solid rgba(25,223,255,.82);
  border-radius:7px;
  background:rgba(5,34,54,.96);
  color:#eaf8ff;
  box-shadow:0 8px 20px rgba(0,0,0,.32),0 0 10px rgba(25,223,255,.18);
  font-size:10px;
}
.library-drag-ghost b{
  color:#19dfff;
}
.playlist.drop-zone-active{
  box-shadow:
    inset 0 0 0 1px rgba(25,223,255,.32),
    0 0 8px rgba(25,223,255,.08);
}
.playlist.drag-target-empty{
  outline:2px dashed #19dfff;
  outline-offset:-4px;
}


/* reliable touch add action */
.pads-panel.library-open .pads{
  display:none !important;
}
.library-item-actions{
  display:none;
}
.library-item.selected .library-item-actions{
  display:block;
}
.library-add{
  min-height:38px;
  font-size:10px;
  touch-action:manipulation;
}

/* somente o ícone preserva a cor do tipo de áudio */
.library-more{
  touch-action:manipulation;
}
.library-item.library-color-blue{
  --library-file-color:#087dff;
  --library-icon-text:#f4fbff;
}
.library-item.library-color-red{
  --library-file-color:#f43d5d;
  --library-icon-text:#fff7f8;
}
.library-item.library-color-yellow{
  --library-file-color:#ffe645;
  --library-icon-text:#17170b;
}
.library-item.library-color-green{
  --library-file-color:#43d889;
  --library-icon-text:#062319;
}
.library-item[class*="library-color-"] .library-item-main>b{
  background:var(--library-file-color);
  color:var(--library-icon-text);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.20);
}
.library-item-actions,
.library-add{
  position:relative;
  z-index:6;
}

/* cores configuráveis: somente o ícone identifica o tipo de áudio */
.library-item .library-item-main>b{
  background:var(--media-color,#149bff);
  color:var(--media-contrast,#fff);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.2),0 0 8px color-mix(in srgb,var(--media-color,#149bff) 28%,transparent);
}
.library-item .library-item-main>b svg,
.row.media-styled>b svg{
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.1;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.row.media-styled>strong,
.row.media-styled>span,
.row.media-styled>em{
  background:var(--media-color,#149bff);
  color:var(--media-contrast,#fff);
}
.row.media-styled>b{
  margin-right:0;
  border-radius:6px 0 0 6px;
  background:var(--media-color,#149bff);
  color:var(--media-contrast,#fff);
  box-shadow:none;
}
.row.media-styled>em{
  border-radius:0 6px 6px 0;
}
.toolstrip .library-shortcut[data-library-filter]:not([data-library-filter="pads"]){
  color:var(--media-color,#13dfff);
  text-shadow:0 0 7px color-mix(in srgb,var(--media-color,#13dfff) 45%,transparent);
}
.toolstrip .library-shortcut[data-library-filter]:not([data-library-filter="pads"]) svg{
  stroke:currentColor !important;
}

/* player principal: INTO ao lado do contador e tempos com melhor leitura */
.timebox{
  display:grid;
  grid-template-columns:max-content minmax(0,1fr);
  align-items:center;
  column-gap:8px;
}
.timebox>small{
  align-self:center;
  font-size:10px;
}
.timebox>strong{
  display:block;
  text-align:left;
}
.time-meta{
  grid-column:1 / -1;
  width:100%;
  margin-top:6px;
}
.time-meta span{
  font-size:7.5px;
  letter-spacing:.01em;
}
.time-meta b{
  font-size:12px;
  line-height:1.1;
  margin-top:3px;
}

/* biblioteca à esquerda e bancos de botoneira */
.left{
  display:flex;
  flex-direction:column;
}
.left.library-open .playlist{
  display:none;
}
.left-library-view{
  flex:1 1 auto;
  min-height:360px;
  max-height:500px;
  margin-top:2px;
  padding:0;
  border:1px dashed rgba(25,223,255,.28);
  border-radius:7px;
  background:rgba(3,18,31,.55);
}
.left-library-view[hidden]{display:none}
.left-library-view .library-head,
.left-library-view .library-search,
.left-library-view .library-status,
.left-library-view .library-list{
  margin-left:6px;
  margin-right:6px;
}
.left-library-view .library-head{
  margin-left:0;
  margin-right:0;
}
.library-welcome{
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:#8fb4c9;
  text-align:center;
  padding:24px;
}
.library-welcome svg{
  width:42px;
  height:42px;
  fill:none;
  stroke:#19dfff;
  stroke-width:1.7;
  filter:drop-shadow(0 0 8px rgba(25,223,255,.3));
}
.library-welcome strong{font-size:12px;color:#dff7ff}
.library-welcome small{font-size:9px;max-width:310px}
.library-list-shortcut{
  margin-top:auto;
}

.pads-panel{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.pad-bank-bar{
  flex:0 0 32px;
  display:grid;
  grid-template-columns:minmax(120px,1fr) auto auto auto 30px 30px;
  gap:4px;
  align-items:center;
}
.pad-bank-bar label{
  min-width:0;
  height:30px;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:5px;
  padding-left:7px;
  border:1px solid rgba(25,223,255,.28);
  border-radius:6px;
  background:#061b2d;
  color:#8fdfff;
  font-size:8px;
}
.pad-bank-bar select{
  min-width:0;
  height:28px;
  border:0;
  outline:0;
  background:#061b2d;
  color:#eaf6ff;
  font:inherit;
  font-size:9px;
}
.pad-bank-bar>button{
  height:30px;
  border:1px solid rgba(25,223,255,.3);
  border-radius:6px;
  background:#08243a;
  color:#bcecff;
  padding:0 7px;
  font-size:8px;
  white-space:nowrap;
}
.pad-bank-bar>button:hover{border-color:#19dfff;color:#fff}
.pads-panel .pads{
  flex:1 1 auto;
  grid-template-rows:repeat(6,minmax(50px,1fr));
}
.pads button.assigned-pad{
  position:relative;
  display:grid;
  grid-template-columns:20px minmax(0,1fr);
  grid-template-rows:1fr auto;
  column-gap:5px;
  align-items:center;
  background:linear-gradient(135deg,var(--media-color,#149bff),color-mix(in srgb,var(--media-color,#149bff) 78%,#061525)) !important;
  color:var(--media-contrast,#fff) !important;
}
.pad-media-icon{
  grid-row:1 / 3;
  display:grid;
  place-items:center;
}
.pad-media-icon svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.pads button.assigned-pad strong{
  min-width:0;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  font-size:9px;
  line-height:1.1;
}
.pads button.assigned-pad small{
  margin:0;
  font-size:8px;
  opacity:.9;
}
.pads button.selected-pad{
  outline:3px solid #ffd84d;
  outline-offset:-3px;
  box-shadow:0 0 11px rgba(255,216,77,.42);
}
.pads button.pad-drop-target{
  outline:3px solid #19dfff;
  outline-offset:-3px;
  filter:brightness(1.18);
}
.pads button.pad-playing{
  animation:padPlaying .55s ease-in-out infinite alternate;
}
.pads button.pad-missing::after{
  content:'!';
  position:absolute;
  top:3px;
  right:4px;
  color:#fff;
  background:#d72849;
  border-radius:50%;
  width:14px;
  height:14px;
  display:grid;
  place-items:center;
}
@keyframes padPlaying{to{filter:brightness(1.28);box-shadow:0 0 12px var(--media-color,#19dfff)}}

@media(max-width:1050px){
  .pad-bank-bar{grid-template-columns:minmax(105px,1fr) auto auto 28px 28px}
  .pad-bank-bar #savePadBank{display:none}
  .pad-bank-bar>button{padding:0 5px;font-size:7.5px}
}

/* playlist: horário e estado em colunas independentes, sem sobreposição */
.row{
  grid-template-columns:72px 24px 28px minmax(0,1.3fr) minmax(0,1fr) 54px 38px;
  column-gap:4px;
}
.row>time{
  min-width:0;
  padding-left:2px;
  overflow:hidden;
  text-align:left;
  font-size:9px;
  line-height:1;
}
.row>.state{
  justify-self:center;
  margin:0;
}
.row>b{
  margin-left:0;
}
@media(min-width:1350px){
  .row{
    grid-template-columns:78px 24px 28px minmax(0,1.3fr) minmax(0,1fr) 60px 40px;
  }
  .row>time{font-size:9.5px}
  .time-meta span{font-size:8px}
  .time-meta b{font-size:13px}
}


/* audio-folder-browser-2026-09-20 */
.right-folder-browser{
  flex:1 1 auto;
  min-height:0;
  border:1px solid var(--studio-line);
  border-radius:7px;
  background:#031321;
  overflow:hidden;
}
.right-folder-browser[hidden],
.pads-panel[hidden]{display:none !important}
.audio-folder-grid{
  width:100%;
  height:100%;
  min-height:360px;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-auto-rows:minmax(92px,1fr);
  align-items:center;
  justify-items:center;
  gap:12px 18px;
  padding:24px 28px;
  background:#031321;
}
.audio-folder-icon{
  width:76px;
  height:76px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  background:transparent;
  color:var(--folder-color,#19dfff);
  cursor:pointer;
  filter:drop-shadow(0 0 7px color-mix(in srgb,var(--folder-color,#19dfff) 30%,transparent));
}
.audio-folder-icon svg{
  width:58px;
  height:58px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.audio-folder-icon:hover,
.audio-folder-icon:focus-visible{
  transform:scale(1.08);
  outline:none;
}
.left-folder-launcher{
  padding:0 !important;
  border:1px dashed rgba(25,223,255,.28);
}
.left-folder-launcher .audio-folder-grid{
  min-height:100%;
  grid-template-columns:repeat(4,minmax(0,1fr));
  padding:22px;
}
.left-folder-launcher .audio-folder-icon{
  width:64px;
  height:64px;
}
.left-folder-launcher .audio-folder-icon svg{width:48px;height:48px}
.right-browser-head{
  min-height:42px;
  display:grid;
  grid-template-columns:34px auto minmax(130px,1fr);
  align-items:center;
  gap:8px;
  padding:5px 8px;
  border-bottom:1px solid rgba(17,104,143,.55);
}
.right-browser-head strong{font-size:12px;color:#eaf6ff}
.right-browser-head input{
  justify-self:end;
  width:min(260px,100%);
  height:30px;
  border:1px solid rgba(25,223,255,.32);
  border-radius:6px;
  background:#041827;
  color:#eaf6ff;
  padding:0 9px;
}
.right-browser-back{
  width:30px;height:30px;border:1px solid rgba(25,223,255,.32);border-radius:6px;
  background:#061b2d;color:#19dfff;font-size:23px;line-height:1;
}
.right-browser-status{padding:5px 9px;color:#8fdfff;font-size:9px}
.right-browser-status.error{color:#ff9cab}
.right-browser-list{
  height:calc(100% - 68px);
  overflow:auto;
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:0 7px 8px;
}
.destination-library-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  min-height:48px;
  border:1px solid rgba(17,104,143,.55);
  border-radius:7px;
  background:linear-gradient(180deg,#08243a,#061a2d);
  overflow:hidden;
}
.destination-library-row.selected{border-color:#ffd84d}
.destination-library-main{
  min-width:0;display:grid;grid-template-columns:30px minmax(0,1fr) 48px;align-items:center;gap:7px;
  min-height:46px;padding:5px 7px;border:0;background:transparent;color:#eaf6ff;text-align:left;
}
.destination-library-main>b{display:grid;place-items:center;color:var(--media-color,#19dfff)}
.destination-library-main>b svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:2}
.destination-library-main>span{min-width:0;display:flex;flex-direction:column}
.destination-library-main strong,.destination-library-main small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.destination-library-main strong{font-size:10px}.destination-library-main small{font-size:8px;color:#8fb4c9}
.destination-library-main em{font-style:normal;font-size:9px;color:#bcecff}
.destination-actions{display:flex;gap:4px;padding-right:6px}
.destination-actions button,.quick-mini-destinations button{
  min-width:30px;height:27px;border:1px solid rgba(25,223,255,.35);border-radius:5px;
  background:#08243a;color:#bcecff;font-size:8px;font-weight:700;
}
.destination-actions button:hover,.quick-mini-destinations button:hover{border-color:#19dfff;color:#fff}
.quick-mini-destinations{
  grid-column:1/-1;
  display:flex;
  justify-content:flex-end;
  gap:4px;
  padding:4px 6px 6px;
  border-top:1px solid rgba(17,104,143,.24);
}
.mini.mini-loaded{
  border-color:#ffd84d !important;
  box-shadow:0 0 10px rgba(255,216,77,.22) !important;
}
@media(max-width:1100px){
  .audio-folder-grid{padding:18px 14px;gap:8px}
  .audio-folder-icon{width:60px;height:60px}
  .audio-folder-icon svg{width:46px;height:46px}
  .destination-actions{gap:2px}
  .destination-actions button{min-width:27px;padding:0 3px}
}


/* studio-corrections-2026-09-20 */
.toolstrip{justify-content:flex-start !important}
.toolstrip .library-list-shortcut{margin-top:auto !important}
.toolstrip .library-list-shortcut svg{width:25px;height:25px;stroke:#19dfff !important;fill:none;stroke-width:1.7}
.library-folder-back{flex:0 0 30px;width:30px;height:30px;display:grid;place-items:center;border:1px solid rgba(25,223,255,.35);border-radius:7px;background:#061b2d;color:#19dfff;font-size:23px;line-height:1;cursor:pointer}
.left-library-view .library-head{display:grid !important;grid-template-columns:30px minmax(0,1fr) 28px !important;align-items:center;gap:8px}
.left-library-view .library-head>div{min-width:0}
.playlist{gap:3px}
.playlist .row{min-height:31px;height:31px;grid-template-columns:72px 24px 28px minmax(0,1.3fr) minmax(0,1fr) 54px 38px;column-gap:4px;align-items:center}
.playlist .row>time{font-size:9px;color:#b9d9ea}
.playlist .row>.state{width:15px;height:15px}
.playlist .row>b,.playlist .row>strong,.playlist .row>span,.playlist .row>em{min-height:29px;height:29px;display:flex;align-items:center}
.playlist .row>.more{width:34px;min-width:34px;height:29px}
.playlist .row.media-styled>b{border-radius:5px 0 0 5px}
.playlist .row.media-styled>em{border-radius:0 5px 5px 0}
@media(min-width:1350px){.playlist .row{grid-template-columns:78px 24px 28px minmax(0,1.3fr) minmax(0,1fr) 60px 40px}}


/* playlist-reference-shape-2026-09-20 */
/* Reference layout: time + status outside; one continuous colored audio strip; menu at far right. */
.playlist .row{
  display:grid !important;
  grid-template-columns:76px 24px minmax(0,1fr) 36px !important;
  column-gap:6px !important;
  min-height:32px !important;
  height:32px !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  overflow:visible !important;
}
.playlist .row>time{
  grid-column:1;
  height:auto !important;
  min-height:0 !important;
  padding:0 2px !important;
  background:transparent !important;
  color:#b9d9ea !important;
}
.playlist .row>.state{
  grid-column:2;
  width:16px !important;
  height:16px !important;
  min-height:16px !important;
  align-self:center;
  justify-self:center;
  background:transparent !important;
}
.playlist .row>b{
  grid-column:3;
  grid-row:1;
  width:34px !important;
  min-width:34px !important;
  height:30px !important;
  min-height:30px !important;
  z-index:2;
  border-radius:6px 0 0 6px !important;
}
.playlist .row>strong{
  grid-column:3;
  grid-row:1;
  height:30px !important;
  min-height:30px !important;
  padding-left:42px !important;
  padding-right:44% !important;
  border-radius:6px !important;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.playlist .row>span{
  grid-column:3;
  grid-row:1;
  justify-self:end;
  width:40% !important;
  height:30px !important;
  min-height:30px !important;
  padding:0 56px 0 8px !important;
  background:transparent !important;
  color:var(--media-contrast,#fff) !important;
  z-index:3;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.playlist .row>em{
  grid-column:3;
  grid-row:1;
  justify-self:end;
  width:52px !important;
  height:30px !important;
  min-height:30px !important;
  padding:0 8px 0 4px !important;
  background:transparent !important;
  color:var(--media-contrast,#fff) !important;
  z-index:4;
  border-radius:0 !important;
}
.playlist .row>.cue-btn{
  grid-column:4;
  grid-row:1;
  width:36px !important;
  min-width:36px !important;
  height:30px !important;
  min-height:30px !important;
  border:1px solid rgba(25,223,255,.42) !important;
  border-radius:6px !important;
  background:#062137 !important;
}
.playlist .row.media-styled>strong{
  background:var(--media-color,#149bff) !important;
  color:var(--media-contrast,#fff) !important;
}
.playlist .row.media-styled>span,
.playlist .row.media-styled>em{
  background:transparent !important;
}
.playlist .row.selected-row{
  outline:1px solid #ffd84d !important;
  outline-offset:1px !important;
}
@media(min-width:1350px){
  .playlist .row{grid-template-columns:82px 24px minmax(0,1fr) 38px !important}
}


/* pad-live-playback-2026-09-20 */
.pad-sequence-toggle{
  width:34px;height:34px;display:grid;place-items:center;padding:0;
  border:1px solid transparent;border-radius:6px;background:transparent;color:#19dfff;cursor:pointer;
}
.pad-sequence-toggle svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pad-sequence-toggle.active{color:#ffd84d;border-color:rgba(255,216,77,.55);background:rgba(255,216,77,.08)}
.pads>button.assigned-pad{position:relative;overflow:hidden;isolation:isolate}
.pads>button.assigned-pad::after{
  content:"";position:absolute;z-index:-1;inset:0 auto 0 0;width:var(--pad-progress,0%);
  background:rgba(255,255,255,.22);pointer-events:none;transition:width .08s linear;
}
.pads>button.pad-playing{filter:brightness(1.08)}
.pads>button.pad-playing .pad-countdown{
  position:absolute;inset:0;z-index:3;display:grid;place-items:center;
  font-size:22px;font-weight:800;letter-spacing:.5px;color:var(--media-contrast,#fff);
  text-shadow:0 1px 2px rgba(0,0,0,.35);
}
.pads>button.pad-queued::before{
  content:"→";position:absolute;z-index:5;top:4px;right:6px;
  font-size:19px;font-weight:900;line-height:1;color:#ffd84d;text-shadow:0 1px 2px rgba(0,0,0,.55);
}


/* pad-playback-correction-2026-09-20 */
.pads>button.pad-playing,
.pads>button.pad-playing.selected-pad{
  outline:none !important;
  box-shadow:none !important;
  border-color:transparent !important;
  filter:none !important;
}
.pads>button.pad-playing::after{
  background:rgba(0,0,0,.24) !important;
  z-index:1 !important;
}
.pads>button.pad-playing>.pad-media-icon,
.pads>button.pad-playing>strong,
.pads>button.pad-playing>small{
  display:none !important;
}
.pads>button.pad-playing>.pad-countdown{
  display:grid !important;
  z-index:4 !important;
  font-size:24px !important;
  font-weight:900 !important;
}
.pad-sequence-toggle.active{
  color:#ffd84d !important;
  border-color:#ffd84d !important;
  background:rgba(255,216,77,.10) !important;
  box-shadow:0 0 7px rgba(255,216,77,.32) !important;
}
.pads>button.pad-queued{
  outline:2px solid #ffd84d !important;
  outline-offset:-2px !important;
}


/* pad-sequence-builder-2026-09-20 */
.pads>button.pad-queued{outline:none !important}
.pads>button.pad-queued::before{content:none !important}
.pads>button.assigned-pad .pad-sequence-pick{
  position:absolute;z-index:6;right:6px;top:5px;
  display:grid;place-items:center;width:22px;height:22px;
  font-size:20px;font-weight:900;line-height:1;color:#ffd84d;
  text-shadow:0 1px 2px rgba(0,0,0,.55);pointer-events:none;
}
.pads>button.assigned-pad .pad-sequence-number{
  position:absolute;z-index:7;right:6px;top:5px;
  display:grid;place-items:center;min-width:24px;height:24px;padding:0 5px;
  border-radius:12px;background:#ffd84d;color:#18202a;
  font-size:14px;font-weight:900;line-height:1;pointer-events:none;
}
.pads>button.pad-sequenced{outline:1px solid rgba(255,216,77,.72) !important;outline-offset:-1px !important}
.pad-sequence-toggle.sequence-ready{
  color:#19dfff !important;border-color:rgba(25,223,255,.48) !important;
  background:rgba(25,223,255,.08) !important;box-shadow:none !important;
}
.pad-sequence-toggle.active{
  color:#ffd84d !important;border-color:#ffd84d !important;
  background:rgba(255,216,77,.10) !important;
}


/* studio-ui-corrections-2026-09-20 */
.pads>button.assigned-pad>.pad-media-icon{display:none !important}
.pads>button.pad-playing>.pad-media-icon{display:none !important}

/* Playlist selection: temporary white strip used only for manual selection. */
.playlist .row.selected-row{
  outline:none !important;
  box-shadow:none !important;
}
.playlist .row.selected-row>b,
.playlist .row.selected-row>strong,
.playlist .row.selected-row>span,
.playlist .row.selected-row>em{
  background:#fff !important;
  color:#071321 !important;
}

/* Pencil and sequence controls: only the icon changes to yellow. */
.pad-config-toggle,.pad-sequence-toggle{
  width:34px;height:34px;display:grid;place-items:center;padding:0;
  border:0 !important;border-radius:0 !important;background:transparent !important;
  box-shadow:none !important;color:#19dfff;cursor:pointer;
}
.pad-config-toggle svg,.pad-sequence-toggle svg{
  width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;
}
.pad-config-toggle.active,.pad-sequence-toggle.active{
  color:#ffd84d !important;background:transparent !important;border:0 !important;box-shadow:none !important;
}
.pad-sequence-toggle.sequence-ready{
  color:#19dfff !important;background:transparent !important;border:0 !important;box-shadow:none !important;
}

/* The bank configuration that used to stay fixed is only visible from the pencil. */
.pads-panel .pad-bank-toolbar,
.pads-panel .pad-bank-controls,
.pads-panel .pad-bank-actions{display:none !important}
.pads-panel.pad-config-open .pad-bank-toolbar,
.pads-panel.pad-config-open .pad-bank-controls,
.pads-panel.pad-config-open .pad-bank-actions{display:flex !important}


/* exact botoneira configuration bar visibility */
.pads-panel>.pad-bank-bar{display:none !important}
.pads-panel.pad-config-open>.pad-bank-bar{display:flex !important}


/* active-control-and-play-fixes-2026-09-20 */
.pad-config-toggle.active svg,.pad-sequence-toggle.active svg{
  stroke:#ffd84d !important;color:#ffd84d !important;
}
.pad-config-toggle.active,.pad-sequence-toggle.active{color:#ffd84d !important}
.player-controls button.play-active,
.mini-controls button.play-active{
  color:#31d66b !important;
  border-color:#31d66b !important;
}
.player-controls button.play-active svg,
.mini-controls button.play-active svg{
  stroke:#31d66b !important;
  fill:none;
}
#playBtn.play-active svg{stroke:#31d66b !important}
#playBtn.play-active svg path{fill:#31d66b !important;stroke:#31d66b !important}


/* pad-drag-and-playlist-spacing-2026-09-20 */
/* Aproxima o horário atual da bolinha de status sem alterar a faixa colorida. */
.playlist .row{
  grid-template-columns:70px 20px minmax(0,1fr) 36px !important;
  column-gap:3px !important;
}
.playlist .row>time{padding-right:0 !important}
.playlist .row>.state{justify-self:start !important}
@media(min-width:1350px){
  .playlist .row{grid-template-columns:74px 20px minmax(0,1fr) 38px !important}
}

/* Arrastar e soltar da botoneira para playlist e P1/P2/P3. */
.pad-drag-ghost{
  position:fixed;z-index:99999;pointer-events:none;max-width:220px;
  padding:7px 10px;border:1px solid rgba(25,223,255,.7);border-radius:6px;
  background:#061b2d;color:#fff;font-size:10px;font-weight:800;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  box-shadow:0 6px 18px rgba(0,0,0,.38);
}
.playlist .row.pad-drag-target>strong{
  outline:2px solid #19dfff !important;outline-offset:1px !important;
}
.playlist.pad-drag-target-empty{
  outline:2px dashed #19dfff;outline-offset:-4px;
}
.mini.pad-drag-target{
  outline:2px solid #19dfff !important;outline-offset:-2px;
  box-shadow:0 0 12px rgba(25,223,255,.28) !important;
}


/* playlist-final-interaction-tuning-2026-09-20 */
.playlist .row{
  grid-template-columns:76px 24px minmax(0,1fr) 38px !important;
  column-gap:6px !important;
}
.playlist .row>time{
  font-size:12px !important;
  font-weight:800 !important;
  text-align:right !important;
  padding-right:0 !important;
}
.playlist .row>.state{
  width:17px !important;
  height:17px !important;
  justify-self:center !important;
  align-self:center !important;
}
.playlist .row.selected-row{
  outline:2px solid #fff !important;
  outline-offset:-1px !important;
  border-radius:7px !important;
  box-shadow:none !important;
}
.playlist .row.selected-row>b,
.playlist .row.selected-row>strong,
.playlist .row.selected-row>span,
.playlist .row.selected-row>em{
  background:initial !important;
  color:inherit !important;
}
.library-head{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto auto !important;
  align-items:center !important;
}
.library-head .library-folder-back{
  grid-column:2 !important;
  margin-left:8px !important;
  margin-right:4px !important;
}
.library-head .library-close{
  grid-column:3 !important;
}


/* left-library-layout-and-playlist-alignment-2026-09-20 */
.left.library-open .left-library-view .library-head{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  min-height:42px !important;
}
.left.library-open .left-library-view .library-head>div:first-child{
  flex:1 1 auto !important;
  min-width:0 !important;
  display:block !important;
}
.left.library-open .left-library-view .library-head strong,
.left.library-open .left-library-view .library-head small{
  display:block !important;
  width:auto !important;
  white-space:normal !important;
}
.left.library-open .left-library-view .library-folder-back{
  order:2 !important;
  flex:0 0 36px !important;
  width:36px !important;
  margin-left:auto !important;
  margin-right:0 !important;
}
.left.library-open .left-library-view .library-close{
  order:3 !important;
  flex:0 0 36px !important;
  width:36px !important;
}
.left.library-open .library-search,
.left.library-open .library-status,
.left.library-open .library-list{
  width:100% !important;
  min-width:0 !important;
}
.left.library-open .library-item{
  width:100% !important;
  box-sizing:border-box !important;
}
.left.library-open .library-item-main{
  min-width:0 !important;
  flex:1 1 auto !important;
}
.playlist .row{
  grid-template-columns:68px 22px minmax(0,1fr) 38px !important;
  column-gap:4px !important;
}
.playlist .row>time{padding-left:0 !important;padding-right:0 !important}
.playlist .row>.state{margin:0 !important}


/* recent-tracks-toolbar-and-row-overflow-2026-09-20 */
.toolstrip .mini-players-toggle{
  width:100%;aspect-ratio:1;border:0;background:transparent;color:#19dfff;
  display:grid;place-items:center;border-radius:6px;padding:7px;
}
.toolstrip .mini-players-toggle svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.toolstrip .mini-players-toggle.active{color:#ffd928}
.right-top-slot{min-height:76px}
.recent-tracks{height:76px;padding:7px 9px;box-sizing:border-box;overflow:hidden}
.recent-tracks>strong{display:block;font-size:11px;margin-bottom:5px;color:#eaf7ff}
.recent-track-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.recent-track{position:relative;min-width:0;border:1px solid rgba(25,223,255,.25);border-radius:5px;padding:5px 8px 4px}
.recent-track strong,.recent-track span,.recent-track small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.recent-track strong{font-size:10px;color:#fff;padding-right:42px}
.recent-track span{font-size:8px;color:#c7d9e7}
.recent-track small{font-size:8px;color:#8fa9ba}
.recent-track b{position:absolute;right:7px;top:8px;color:#19dfff;font-size:9px}
.recent-empty{grid-column:1/-1;color:#6f899b;font-size:9px;padding:8px}
.mini-players[hidden],.recent-tracks[hidden]{display:none!important}
.playlist{padding-right:8px!important}
.playlist .row{padding-right:4px!important;overflow:visible!important}
.playlist .row>button:last-child,.playlist .row .row-menu{margin-right:1px!important}


/* execution-history-approved-2026-09-20 */
.toolstrip .mini-players-toggle,.toolstrip .history-toggle{
  width:100%!important;aspect-ratio:1!important;padding:5px!important;border:0;background:transparent;
  display:grid;place-items:center;border-radius:6px
}
.toolstrip .mini-players-toggle svg,.toolstrip .history-toggle svg{width:28px!important;height:28px!important}
.toolstrip .history-toggle{color:#28d77c}
.toolstrip .history-toggle.active{background:rgba(40,215,124,.10);outline:2px solid #8bea42}
.recent-tracks>strong{font-size:11px}
.recent-track strong{padding-right:0!important}
.recent-track span{color:#25a9ff!important}
.recent-track b{display:none!important}
.execution-history-panel{height:100%;min-height:0;padding:10px 12px;box-sizing:border-box;overflow:hidden}
.execution-history-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.execution-history-head>div{display:flex;align-items:center;gap:8px}
.execution-history-head select{background:#061c2c;color:#eaf7ff;border:1px solid #13bfe8;border-radius:5px;padding:5px 24px 5px 8px}
.execution-history-head button{background:transparent;color:#fff;border:0;font-size:22px}
.execution-history-columns,.execution-history-row{display:grid;grid-template-columns:74px 105px minmax(180px,1fr) minmax(120px,.8fr);align-items:center}
.execution-history-columns{font-size:9px;color:#a9bfcd;border-bottom:1px solid #15506a;padding:5px 7px}
.execution-history-list{max-height:calc(100% - 72px);overflow:hidden}
.execution-history-list.scrollable{overflow-y:auto}
.execution-history-row{min-height:30px;padding:0 7px;border-bottom:1px solid rgba(24,112,145,.42);font-size:9px}
.execution-history-row strong{font-weight:600;color:#eef8ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.execution-history-row em{font-style:normal;color:#6bbfff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.execution-history-row .history-type{color:#bcd1dc}


/* central-toolbar-selected-yellow-2026-09-20 */
.toolstrip button.active,
.toolstrip button[aria-pressed="true"],
.toolstrip .library-shortcut.active,
.toolstrip .mini-players-toggle.active,
.toolstrip .history-toggle.active,
.toolstrip .pad-sequence-toggle.active,
.toolstrip .pad-sequence-toggle.sequence-ready,
.toolstrip .pad-config-toggle.active{
  color:#ffd928!important;
}
.toolstrip .history-toggle{color:#28d77c}
.toolstrip .history-toggle.active{color:#ffd928!important;outline-color:#ffd928!important}


/* approved-central-toolbar-and-history-cleanup-2026-09-20 */
.toolstrip button,
.toolstrip button.active,
.toolstrip button[aria-pressed="true"],
.toolstrip .library-shortcut,
.toolstrip .library-shortcut.active,
.toolstrip .mini-players-toggle,
.toolstrip .mini-players-toggle.active,
.toolstrip .history-toggle,
.toolstrip .history-toggle.active,
.toolstrip .pad-sequence-toggle,
.toolstrip .pad-sequence-toggle.active,
.toolstrip .pad-sequence-toggle.sequence-ready,
.toolstrip .pad-config-toggle,
.toolstrip .pad-config-toggle.active{
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  border-radius:0!important;
}
.toolstrip button.active,
.toolstrip button[aria-pressed="true"],
.toolstrip .library-shortcut.active,
.toolstrip .mini-players-toggle.active,
.toolstrip .history-toggle.active,
.toolstrip .pad-sequence-toggle.active,
.toolstrip .pad-sequence-toggle.sequence-ready,
.toolstrip .pad-config-toggle.active{color:#ffd928!important}
.toolstrip .mini-players-toggle svg,.toolstrip .history-toggle svg{width:32px!important;height:32px!important}
.right-top-slot{height:76px!important;min-height:76px!important}
.recent-tracks{height:76px!important;padding:6px 10px!important}
.recent-tracks>strong{font-size:11px!important;margin-bottom:3px!important}
.recent-track-list{gap:5px!important}
.recent-track{padding:3px 7px!important;min-height:36px!important}
.execution-history-panel{height:100%!important;padding:10px 12px!important}
.execution-history-head{min-height:34px!important;margin-bottom:6px!important;gap:12px!important}
.execution-history-head>strong{font-size:14px!important;white-space:nowrap!important}
.execution-history-head>div{margin-left:auto!important;gap:7px!important}
.execution-history-head label{display:flex!important;align-items:center!important;gap:6px!important;font-size:11px!important}
.execution-history-head select{height:30px!important;font-size:10px!important}
.execution-history-head button{width:28px!important;height:28px!important;display:grid!important;place-items:center!important}
.execution-history-list{max-height:calc(100% - 68px)!important}


/* mini-players-approved-progress-layout-2026-09-20 */
.mini{--mini-media-color:#149bff;--mini-progress:0%}
.mini .mini-title{
  position:relative!important;
  overflow:hidden!important;
  background:linear-gradient(90deg,var(--mini-media-color) 0 var(--mini-progress),#0754b5 var(--mini-progress) 100%)!important;
}
.mini .mini-title>*{position:relative;z-index:1}
.mini .mini-badge{
  background:var(--mini-media-color)!important;
  color:#fff!important;
}
.mini .mini-progress{display:none!important}
.mini .mini-controls{
  min-height:38px!important;
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  align-items:center!important;
  gap:8px!important;
}
.mini .mini-controls button{
  font-size:20px!important;
  min-width:32px!important;
  min-height:30px!important;
  padding:2px 5px!important;
}
.mini .mini-controls button.active{color:#ffd928!important}


/* next-block-preview-and-scroll-2026-09-20 */
.left{min-height:0!important}
.playlist{min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;scrollbar-width:thin;scrollbar-color:#20bfff #061a29}
.now-label-row{display:flex;align-items:center;gap:10px}
.next-block-link{border:0!important;background:transparent!important;color:#20a9ff!important;font-size:9px!important;font-weight:700!important;padding:0!important;cursor:pointer}
.next-block-link:hover{text-decoration:underline}
.next-block-panel{height:100%;min-height:0;padding:10px 12px;box-sizing:border-box;overflow:hidden}
.next-block-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #15506a;padding-bottom:8px}
.next-block-head>div:first-child{display:flex;flex-direction:column;gap:2px}
.next-block-head strong{font-size:17px;color:#eef8ff}.next-block-head strong span{color:#19dfff}
.next-block-head small{font-size:9px;color:#8fa9ba}
.block-time-picker{display:flex;align-items:center;gap:8px}.block-time-picker label{font-size:9px;color:#bcd1dc}
.block-time-picker select{margin-left:5px;background:#061c2c;color:#eaf7ff;border:1px solid #13bfe8;border-radius:5px;padding:5px 22px 5px 8px}
.block-time-picker button{border:0;background:transparent;color:#fff;font-size:20px}
.next-block-meta{display:flex;gap:24px;padding:8px 4px;font-size:9px;color:#a9bfcd}.next-block-meta b{color:#19dfff}
.next-block-list{overflow-y:auto;max-height:calc(100% - 88px);border-top:1px solid rgba(21,80,106,.7)}
.next-block-row{display:grid;grid-template-columns:34px 34px minmax(0,1fr) 62px;align-items:center;min-height:36px;border-bottom:1px solid rgba(21,80,106,.55);padding:0 7px}
.next-block-row .block-index{font-size:9px;color:#829aaa}.next-block-row .block-icon{font-size:19px;text-align:center}
.next-block-row strong{font-size:10px;color:#edf7ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.next-block-row time{text-align:right;font-size:9px;color:#c7d9e7}
.mini .mini-title{background:linear-gradient(90deg,#18bfff 0 var(--mini-progress),#0754b5 var(--mini-progress) 100%)!important}

.next-block-link{font-size:12px!important;font-weight:800!important;letter-spacing:.15px!important}
.next-block-empty{padding:28px 12px;text-align:center;color:#7896a8;font-size:11px}


/* musical-program-browser-and-mini-play-state-2026-09-20 */
.music-program-label{font-size:11px!important;font-weight:800!important;letter-spacing:.25px!important;text-transform:none!important}
.mini .mini-controls button:first-child{color:#19dfff!important}
.mini .mini-controls button:first-child.mini-play-running{color:#2ee66b!important;text-shadow:0 0 8px rgba(46,230,107,.45)}
.right-top-slot[hidden]{display:none!important}
.web-browser-panel{height:100%!important;min-height:0!important;display:flex;flex-direction:column;overflow:hidden}
.web-browser-panel[hidden]{display:none!important}
.web-browser-head{height:38px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;border-bottom:1px solid #15506a}
.web-browser-head strong{font-size:12px;color:#eaf7ff}.web-browser-head button{border:0;background:transparent;color:#fff;font-size:20px}
.web-browser-toolbar{height:42px;display:grid;grid-template-columns:34px 34px 34px 1fr 42px;gap:5px;align-items:center;padding:5px 8px;border-bottom:1px solid #15506a}
.web-browser-toolbar button,.web-browser-toolbar input{height:30px;border:1px solid #126d91;border-radius:5px;background:#061c2c;color:#eaf7ff}
.web-browser-toolbar input{padding:0 9px}
#studioBrowserFrame{flex:1;width:100%;min-height:0;border:0;background:#fff}

/* central config selected state fix */
.toolstrip .pad-config-toggle.active,
.toolstrip .pad-config-toggle[aria-pressed="true"]{color:#ffd84d!important;background:transparent!important;border:0!important;box-shadow:none!important}

/* whatsapp-integrated-panel-2026-09-20 */
.whatsapp-panel{background:#061728;min-height:0;flex:1;overflow:hidden}.whatsapp-head{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid rgba(22,164,220,.34)}.whatsapp-head>div{display:flex;flex-direction:column}.whatsapp-head strong{font-size:15px}.whatsapp-head small{font-size:9px;color:#8aa8bb}.whatsapp-head button{border:0;background:transparent;color:#eaf6ff;font-size:22px;cursor:pointer}.whatsapp-body{display:grid;grid-template-columns:34% 1fr;height:calc(100% - 48px);min-height:520px}.whatsapp-conversations{border-right:1px solid rgba(22,164,220,.28);padding:10px;background:#051522}.whatsapp-search{padding:9px 10px;border:1px solid rgba(22,164,220,.28);border-radius:5px;font-size:12px;font-weight:700}.whatsapp-empty{padding:20px 8px;color:#7997aa;font-size:11px;line-height:1.5;text-align:center}.whatsapp-chat{display:grid;place-items:center;padding:24px;background:#061a2c}.whatsapp-chat-empty{max-width:360px;text-align:center;display:flex;flex-direction:column;gap:8px}.whatsapp-chat-empty strong{font-size:17px;color:#25d366}.whatsapp-chat-empty span{font-size:11px;color:#9bb3c3;line-height:1.5}

/* social-center-2026-09-20 */
.social-panel{background:#061728;min-height:0;flex:1;overflow:hidden}.social-head{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid rgba(22,164,220,.34)}.social-head>div{display:flex;flex-direction:column}.social-head strong{font-size:15px}.social-head small{font-size:9px;color:#8aa8bb}.social-head>button{border:0;background:transparent;color:#eaf6ff;font-size:22px;cursor:pointer}.social-tabs{display:flex;gap:4px;padding:8px;border-bottom:1px solid rgba(22,164,220,.22)}.social-tabs button{border:1px solid rgba(22,164,220,.28);background:#071d31;color:#a9c2d2;border-radius:5px;padding:8px 10px;font-size:10px}.social-tabs button.active{color:#19dfff;border-color:#19dfff}.social-body{min-height:500px;display:grid;place-items:center;padding:24px}.social-empty{max-width:390px;text-align:center;display:flex;flex-direction:column;gap:10px}.social-empty strong{font-size:18px;color:#19dfff}.social-empty span{font-size:11px;color:#9bb3c3}.social-empty button{align-self:center;border:1px solid #19dfff;background:#072b48;color:#eaf6ff;border-radius:5px;padding:9px 14px;cursor:pointer}

/* center-toolbar-uniform-alignment-2026-09-20 */
.workspace>.toolstrip{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:0;margin:0}
.workspace>.toolstrip>button{box-sizing:border-box;flex:0 0 36px;width:36px!important;height:36px!important;min-width:36px;min-height:36px;margin:0!important;padding:6px!important;display:flex!important;align-items:center!important;justify-content:center!important;line-height:1!important}
.workspace>.toolstrip>button svg{display:block;width:24px!important;height:24px!important;min-width:24px;min-height:24px;margin:0!important;stroke:currentColor;fill:none;stroke-width:1.8;vector-effect:non-scaling-stroke}
.workspace>.toolstrip>button b,.workspace>.toolstrip>button span{line-height:1}

/* playlist-replace-track-2026-09-20 */
.playlist .row.replace-target{animation:playlistReplaceBlink .72s steps(2,end) infinite}
.playlist .row.replace-target>b,.playlist .row.replace-target>strong,.playlist .row.replace-target>span,.playlist .row.replace-target>em{animation:playlistReplaceCells .72s steps(2,end) infinite}
@keyframes playlistReplaceBlink{50%{filter:brightness(2);box-shadow:0 0 0 2px #fff,0 0 12px rgba(255,255,255,.9)}}
@keyframes playlistReplaceCells{50%{background:#fff!important;color:#06111f!important}}
.playlist-actions [data-action="replace-track"]{color:#eaf6ff}

/* external-browser-launcher-2026-09-20 */
.studio-browser-launcher{min-height:430px;background:#fff;color:#15283a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:28px;text-align:center}.studio-browser-launcher>strong{font-size:24px}.studio-browser-launcher>span{color:#627487}.studio-browser-shortcuts{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:14px 0}.studio-browser-shortcuts button{min-width:110px;padding:12px 18px;border:1px solid #0aaee8;border-radius:8px;background:#f7fbfe;color:#06324a;font-weight:700}.studio-browser-launcher small{color:#718294}.web-browser-toolbar #browserAddress{flex:1}


/* ipad-pwa-stable-viewport-2026-09-20
   Keep standalone iPad layout pinned to the stable viewport and safe area.
   This avoids bottom-edge oscillation when WebKit updates the dynamic viewport. */
@supports (-webkit-touch-callout:none){
  html,body{
    width:100%;
    height:100%;
    min-height:100%;
    overflow:hidden;
    overscroll-behavior:none;
  }
  body{
    position:fixed;
    inset:0;
    height:100%;
    min-height:0;
  }
  .shell{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    min-height:0;
    max-height:none;
    padding-bottom:env(safe-area-inset-bottom,0px);
    overflow:hidden;
  }
  .workspace{
    min-height:0;
    overflow:hidden;
  }
  .taskbar{
    flex-shrink:0;
  }
}
@media (display-mode:standalone){
  html,body{
    height:100%;
    min-height:100%;
    overflow:hidden;
  }
  body{
    position:fixed;
    inset:0;
  }
  .shell{
    height:100%;
    max-height:100%;
    padding-bottom:env(safe-area-inset-bottom,0px);
  }
}


/* embedded-studio-browser-2026-09-20 */
.web-browser-panel{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;overflow:hidden;background:#061728}
.web-browser-panel[hidden]{display:none!important}
.web-browser-head{flex:0 0 auto}
.web-browser-toolbar{flex:0 0 auto}
.studio-browser-frame{display:block;flex:1 1 auto;width:100%;min-height:0;border:0;background:#fff}
