/* Sözlük Radyosu 9.9 — priority: readable teaser, compact FX, no vertical mixer scrolling. */
.dj-page header{height:40px!important;min-height:40px;padding:0 14px!important}
.dj-page header .brand{font-size:13px!important}
.dj-page main{padding:6px 10px!important;max-width:1800px!important}
.dj-page #console{
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:auto 94px auto minmax(0,1fr)!important;
  height:calc(100dvh - 54px)!important;min-height:550px;
  gap:6px!important;align-content:stretch!important;overflow:hidden!important;
}
.dj-page #console[hidden]{display:none!important}
.dj-page #consoleTop{grid-column:1!important;grid-row:1!important;position:relative!important;padding:6px 10px!important;gap:5px!important}
.dj-page .console-top-line strong{font-size:12px!important}
.dj-page .quick-actions{gap:6px!important}
.dj-page .quick-actions button,.dj-page .quick-listen{padding:6px 10px!important;min-height:31px!important;font-size:11px!important}
.dj-page .studio-tabs{gap:5px;flex-wrap:nowrap!important}
.dj-page .studio-tabs button{font-size:12px!important;padding:6px 9px!important;min-height:31px;line-height:1.2!important}
/* FX appears ONLY on the broadcast tab. Removing it on guests/listeners frees the entire workspace. */
.dj-page #console[data-view="radio"] #fxQuickStrip{
  display:block!important;grid-column:1!important;grid-row:2!important;height:94px!important;
  min-height:94px!important;max-height:94px!important;padding:4px 9px!important;
  overflow:hidden!important;margin:0!important
}
.dj-page #console[data-view="guests"] #fxQuickStrip,
.dj-page #console[data-view="listeners"] #fxQuickStrip,
.dj-page #console[data-view="effects"] #fxQuickStrip{display:none!important}
.dj-page #fxQuickStrip #effectsPanel{display:flex!important;flex-direction:column!important;gap:3px!important;min-height:0!important;overflow:hidden!important}
.dj-page #fxQuickStrip .fx-mini-toolbar{display:flex;align-items:center;gap:9px;min-height:23px!important;height:23px!important;flex:0 0 23px}
.dj-page #fxQuickStrip .fx-mini-title{font-size:11px;white-space:nowrap;letter-spacing:.035em;color:#d8d0ff}
.dj-page #fxQuickStrip .fx-mini-toolbar>label{display:flex!important;align-items:center;gap:5px;font-size:10px!important;margin:0!important;white-space:nowrap}
.dj-page #fxQuickStrip #fxVolume{width:95px!important;max-width:95px!important;min-width:50px!important;margin:0!important}
.dj-page #fxQuickStrip #fxStopAll{margin-left:auto;padding:4px 8px!important;font-size:10px!important;min-height:23px!important;white-space:nowrap!important}
.dj-page #fxQuickStrip .fx-library{flex:1!important;min-height:0!important;padding:0!important;margin:0!important;overflow:hidden!important}
.dj-page #fxQuickStrip #fxLibrary{
  display:grid!important;grid-auto-flow:column!important;
  grid-template-rows:repeat(2,29px)!important;grid-auto-columns:105px!important;
  gap:3px 5px!important;overflow-x:auto!important;overflow-y:hidden!important;
  min-height:63px!important;max-height:63px!important;height:63px!important;
  margin:0!important;padding:0 1px 3px!important;align-content:start!important;
  scrollbar-width:thin!important;
}
.dj-page #fxQuickStrip .fx-one-tap{
  display:flex!important;align-items:center!important;justify-content:center!important;
  min-width:0!important;max-width:none!important;width:105px!important;
  height:29px!important;min-height:29px!important;max-height:29px!important;
  padding:2px 4px!important;font-size:10px!important;line-height:1.08!important;
  font-weight:750!important;border-radius:6px!important;white-space:normal!important;
  word-break:normal!important;overflow-wrap:normal!important;overflow:hidden!important;
}
/* The compact sound desk has no internal scroll; diagnostic tools live in a pop-out drawer. */
.dj-page #console[data-view="radio"] #mixerPanel{
  display:block!important;grid-column:1!important;grid-row:3!important;
  margin:0!important;padding:6px 10px!important;min-height:0!important;
  max-height:none!important;height:auto!important;overflow:visible!important;position:relative;
  z-index:12;background:#111b2e;
}
.dj-page #mixerPanel .mix-inline{display:flex!important;align-items:center;gap:10px;flex-wrap:nowrap;min-width:0}
.dj-page #mixerPanel .mix-title{white-space:nowrap;font-size:11px;color:#c9c6fc}
.dj-page #mixerPanel label.mix-level{min-width:0;flex:1 1 175px;display:grid!important;grid-template-columns:auto auto;grid-template-rows:auto 13px;gap:0 8px;align-items:center;margin:0!important;font-size:11px!important;white-space:nowrap}
.dj-page #mixerPanel label.mix-level strong{grid-column:2;grid-row:1;justify-self:end;color:#c7f1e4;font-size:11px}
.dj-page #mixerPanel label.mix-level input{grid-column:1/3;grid-row:2;align-self:center;min-width:0;margin:0!important;width:100%!important;height:12px!important;padding:0!important}
.dj-page #mixerPanel .mix-buttons{display:flex;align-items:center;gap:4px;flex-shrink:0}
.dj-page #mixerPanel .mix-buttons button{padding:6px 9px!important;min-height:30px!important;font-size:11px!important;white-space:nowrap}
.dj-page #mixerPanel label.mix-duck{display:flex!important;align-items:center;gap:4px;flex:0 0 auto;margin:0!important;font-size:11px!important;white-space:nowrap}
.dj-page #mixerPanel label.mix-duck input{margin:0!important}
.dj-page #mixerPanel .mix-drawer{position:relative;flex:0 0 auto;min-width:0;border:0;margin:0;padding:0}
.dj-page #mixerPanel .mix-drawer>summary{list-style:none;cursor:pointer;border:1px solid #53647d;border-radius:8px;padding:7px 9px;font-size:11px;color:#d7defa;white-space:nowrap}
.dj-page #mixerPanel .mix-drawer>summary::-webkit-details-marker{display:none}
.dj-page #mixerPanel .mix-more{position:absolute;right:0;top:calc(100% + 8px);width:min(560px,calc(100vw - 24px));max-height:min(75dvh,690px);overflow:auto;overscroll-behavior:contain;background:#13223b;border:1px solid #52689d;border-radius:13px;box-shadow:0 28px 70px #000b;padding:15px;z-index:100}
.dj-page #mixerPanel .mix-more>h2{display:none}
.dj-page #mixerPanel .mix-more>label,.dj-page #mixerPanel .mix-more>details{margin:7px 0!important}
/* Radio editing surface: queue left; generous always-visible teaser on the right. */
.dj-page #console[data-view="radio"] #broadcastPanel.radio-station{
  display:flex!important;grid-column:1!important;grid-row:4!important;min-height:0!important;
  height:auto!important;overflow:hidden!important;padding:5px!important;z-index:1
}
.dj-page #console[data-view="radio"] .station-workbench{
  flex:1;min-height:0!important;height:100%!important;overflow:hidden!important;
  display:grid!important;grid-template-columns:minmax(260px, .78fr) minmax(390px,1.22fr)!important;gap:7px!important;
}
.dj-page .station-workbench>.station-queue,.dj-page .station-workbench>.station-media{min-height:0!important;max-height:none!important;overflow:hidden!important;padding:8px!important}
.dj-page .station-queue{display:flex!important;flex-direction:column!important;gap:4px!important}
.dj-page .station-queue>.queue-list{flex:1 1 auto!important;min-height:85px!important;max-height:none!important;overflow-y:auto!important}
.dj-page .station-queue .queue-transport{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:4px!important}
.dj-page .station-queue .queue-transport button{padding:5px 6px!important;min-height:30px!important;font-size:11px!important}
.dj-page .station-media{display:flex!important;flex-direction:column!important;min-height:0!important;gap:5px!important}
.dj-page .track-clock{min-height:0!important;padding:7px 10px!important;flex:0 0 auto!important}
.dj-page .track-title{font-size:14px!important;margin:4px 0!important;line-height:1.2!important;max-height:1.4em!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dj-page .track-timers{gap:6px!important}
.dj-page .track-timers small{font-size:10px!important}
.dj-page .track-timers strong{font-size:18px!important}
.dj-page .song-progress{margin:5px 0 0!important;height:4px!important}
.dj-page .clock-note{display:none!important}
.dj-page .teaser-desk{display:flex!important;flex:1 1 auto!important;gap:5px!important;min-height:0!important;height:auto!important;max-height:none!important;overflow:hidden!important;padding:5px 0 0!important;border-top:1px solid #45557c}
.dj-page .teaser-head{font-size:13px!important;min-height:22px!important;flex:0 0 auto!important}
.dj-page .teaser-row{min-height:0;flex:0 0 auto!important}
.dj-page .teaser-row select,.dj-page #teaserTitle{font-size:13px!important;height:34px!important;min-height:34px!important;margin:0!important;padding:5px 9px!important}
.dj-page #teaserTitle{flex:0 0 auto!important}
.dj-page #teaserEditor{display:block!important;flex:1 1 auto!important;min-height:145px!important;height:100%!important;max-height:none!important;resize:none!important;padding:12px 15px!important;font-size:clamp(16px,1.42vw,21px)!important;line-height:1.72!important;overflow-y:auto!important;background:#071326!important;border:1px solid #6174a2!important}
.dj-page .teaser-buttons{margin-top:0!important;gap:5px!important}
.dj-page .teaser-buttons button{min-height:32px!important;padding:5px 10px!important;font-size:11px!important;white-space:normal}
/* Non-radio sections fill the same work area with no effects, mixer or queue. */
.dj-page #console[data-view="guests"],.dj-page #console[data-view="listeners"]{grid-template-rows:auto minmax(0,1fr)!important}
.dj-page #console[data-view="guests"] #mixerPanel,.dj-page #console[data-view="listeners"] #mixerPanel,
.dj-page #console[data-view="guests"] #broadcastPanel,.dj-page #console[data-view="listeners"] #broadcastPanel{display:none!important}
.dj-page #console[data-view="guests"] #guestsPanel,.dj-page #console[data-view="listeners"] #listenersPanel{display:block!important;grid-column:1!important;grid-row:2!important;overflow-y:auto!important}
/* Medium tablet layout keeps the teaser large and places the compact mixer above it. */
@media(max-width:1060px){
  .dj-page #console{height:calc(100dvh - 50px)!important;overflow-y:auto!important;grid-template-rows:auto 94px auto auto!important;min-height:0!important;align-content:start!important}
  .dj-page #consoleTop{position:sticky!important;top:0!important;z-index:50}
  .dj-page #mixerPanel .mix-inline{flex-wrap:wrap!important;gap:8px!important}
  .dj-page #mixerPanel .mix-level{flex:1 1 210px!important}
  .dj-page #console[data-view="radio"] #broadcastPanel.radio-station{min-height:625px!important;height:auto!important;overflow:visible!important}
  .dj-page #console[data-view="radio"] .station-workbench{height:auto!important;min-height:610px!important;overflow:visible!important;grid-template-columns:minmax(230px,.9fr) minmax(0,1.1fr)!important}
  .dj-page .station-workbench>.station-media{min-height:570px!important}
  .dj-page #teaserEditor{min-height:300px!important}
  .dj-page #console[data-view="guests"],.dj-page #console[data-view="listeners"]{grid-template-rows:auto auto!important}
}
/* On phones, a full-width teaser comes FIRST; music queue follows. Never clip the editor. */
@media(max-width:680px){
  .dj-page header{height:38px!important;padding:0 10px!important}
  .dj-page main{padding:5px!important}
  .dj-page #console{height:calc(100dvh - 45px)!important;overflow-y:auto!important;grid-template-rows:auto 94px auto auto!important;gap:5px!important}
  .dj-page #consoleTop{padding:6px!important}
  .dj-page .console-top-line{gap:6px!important}
  .dj-page .console-top-line strong{font-size:11px!important;white-space:normal!important}
  .dj-page .quick-actions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px!important}
  .dj-page .quick-actions .quick-listen{grid-column:1/-1!important;min-height:25px!important;padding:5px!important}
  .dj-page .quick-actions button{min-height:32px!important;padding:6px 2px!important;font-size:10px!important}
  .dj-page .studio-tabs button{font-size:11px!important;padding:7px 4px!important}
  .dj-page #fxQuickStrip .fx-one-tap{font-size:10px!important;width:102px!important}
  .dj-page #fxQuickStrip #fxLibrary{grid-auto-columns:102px!important}
  .dj-page #fxQuickStrip .fx-mini-toolbar{gap:5px!important}
  .dj-page #fxQuickStrip #fxVolume{width:70px!important;max-width:70px!important}
  .dj-page #mixerPanel .mix-title{flex:1 1 100%!important}
  .dj-page #mixerPanel .mix-level{flex:1 1 40%!important;font-size:10px!important}
  .dj-page #mixerPanel .mix-buttons{flex:1 1 auto}
  .dj-page #mixerPanel .mix-buttons button{padding:7px 6px!important;font-size:10px!important}
  .dj-page #mixerPanel .mix-duck{font-size:10px!important}
  .dj-page #mixerPanel .mix-drawer{margin-left:auto!important}
  .dj-page #console[data-view="radio"] #broadcastPanel.radio-station{display:block!important;min-height:0!important;padding:3px!important;overflow:visible!important}
  .dj-page #console[data-view="radio"] .station-workbench{display:flex!important;flex-direction:column!important;height:auto!important;min-height:0!important;overflow:visible!important;gap:7px!important}
  .dj-page .station-workbench>.station-media{order:0!important;max-height:none!important;min-height:560px!important;overflow:visible!important}
  .dj-page .station-workbench>.station-queue{order:1!important;max-height:none!important;min-height:250px!important;overflow:visible!important}
  .dj-page .teaser-desk{min-height:390px!important;overflow:visible!important;flex:1 1 auto!important}
  .dj-page #teaserEditor{min-height:320px!important;height:320px!important;flex:1 0 auto!important;font-size:17px!important;resize:vertical!important}
  .dj-page .station-queue>.queue-list{max-height:260px!important;overflow-y:auto!important}
  .dj-page .queue-add{flex-wrap:wrap!important}
  .dj-page .queue-add button{width:100%!important}
  .dj-page #console[data-view="guests"],.dj-page #console[data-view="listeners"]{grid-template-rows:auto auto!important}
  .dj-page #console[data-view="guests"] #guestsPanel,.dj-page #console[data-view="listeners"] #listenersPanel{overflow-y:visible!important}
}
/* Prevent label clipping while retaining compact controls. */
.dj-page #console button{max-width:100%;text-overflow:clip!important;letter-spacing:normal!important}
.dj-page #console .mix-buttons button,.dj-page #console .teaser-buttons button{word-break:normal!important;overflow-wrap:break-word!important}
.sr-sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
/* DJ sees listener reactions on ALL tabs; recent reactions are synchronized on login. */
.dj-page .dj-reactions{display:flex;align-items:center;gap:8px;min-width:0;min-height:23px;border-top:1px solid #ffffff1f;padding-top:4px}
.dj-page .dj-reactions>strong{white-space:nowrap;color:#c4b5fd;font-size:10px;letter-spacing:.05em}
.dj-page #djReactionWall{display:flex;align-items:center;min-width:0;gap:4px;overflow:hidden;height:24px;flex:1}
.dj-page .dj-reaction-chip{flex:0 0 auto;font-size:19px;line-height:22px;animation:chipIn .35s ease;background:#41326780;border-radius:6px;padding:0 3px}
.dj-page .quiet-text{color:#a3afc9;font-size:10px}
/* Live DJ announcements, kept in a small panel BELOW the track queue. */
.dj-page .ticker-editor{flex:0 0 auto;display:flex;flex-direction:column;gap:4px;min-width:0;background:#111f38;border:1px solid #4c608c;border-radius:9px;padding:7px 8px}
.dj-page .ticker-header{display:flex;align-items:center;gap:9px;justify-content:space-between;min-width:0}
.dj-page .ticker-header strong{white-space:nowrap;color:#b6eeda;font-size:11px}
.dj-page #tickerResult{font-size:10px;color:#99e3c7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:65%}
.dj-page #tickerText{display:block;width:100%;min-height:39px;max-height:96px;height:42px;resize:vertical;font-size:12px;line-height:1.35;padding:5px 8px;background:#091529;border:1px solid #425577;border-radius:6px;color:#f1f5ff}
.dj-page .ticker-actions{display:flex;align-items:center;gap:5px}
.dj-page .ticker-actions button{flex:1;min-width:0;font-size:11px!important;padding:6px 7px!important;min-height:29px!important}
.dj-page #tickerHistory{font-size:11px;min-height:28px;height:28px;width:100%;margin:0;padding:4px 6px}
.dj-page .ticker-help{font-size:9px;color:#a3adc8;line-height:1.2}
/* Marquee on listener screen, no text clipping or horizontal page overflow. */
.broadcast-ticker{display:flex;align-items:center;gap:10px;background:linear-gradient(90deg,#403174,#1b385b);border:1px solid #7368bd;border-radius:12px;margin:0 0 16px;padding:11px 12px;color:#fff;max-width:100%;overflow:hidden;min-height:48px}
.broadcast-ticker[hidden]{display:none!important}
.broadcast-ticker>strong{font-size:11px;flex:0 0 auto;white-space:nowrap;letter-spacing:.08em}
.broadcast-ticker .ticker-viewport{flex:1;min-width:0;overflow:hidden;white-space:nowrap;mask-image:linear-gradient(90deg,transparent 0%,black 3%,black 97%,transparent 100%)}
.broadcast-ticker .ticker-moving{display:inline-block;white-space:nowrap;padding-left:100%;font-size:15px;font-weight:750;line-height:1.6;will-change:transform;animation:radioTickerRun 22s linear infinite}
@keyframes radioTickerRun{from{transform:translateX(0)}to{transform:translateX(-100%)}}
@media(prefers-reduced-motion:reduce){.broadcast-ticker .ticker-moving{animation:none!important;padding-left:0;white-space:normal;overflow-wrap:anywhere;will-change:auto}}
@media(max-width:1060px){
  .dj-page .ticker-editor{order:-1}
  .dj-page #tickerText{min-height:45px;height:50px}
  .dj-page .ticker-help{display:none}
  .dj-page .ticker-header>span{max-width:50%}
}
@media(max-width:680px){
  .dj-page .ticker-editor{margin:0 0 5px;order:-1}
  .dj-page .dj-reactions{padding:3px 0}
  .dj-page #consoleTop{overflow:visible}
  .broadcast-ticker{padding:9px 8px;gap:6px}
  .broadcast-ticker>strong{font-size:10px}
  .broadcast-ticker .ticker-moving{font-size:13px}
}

/* 9.9.1 · clear guest recording and microphone source controls */
.guest-mic-setup{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px;background:#101c34;border:1px solid #425776;border-radius:12px;margin:8px 0 15px;align-items:center}
.guest-mic-setup label{font-weight:750;font-size:12px;color:#dbe6ff}
.guest-mic-setup select{width:100%;min-width:0;background:#0c1730;color:#fff;border:1px solid #5c7195;padding:9px;border-radius:8px;font-size:13px}
.guest-mic-setup #guestTestMic{grid-column:1/-1;min-height:38px;font-size:13px}
.guest-mic-setup .guest-test-note{grid-column:1/-1;font-size:12px;margin:0;color:#a6ead2}
.guest-mic-setup audio{grid-column:1/-1;width:100%}
@media(max-width:680px){.guest-mic-setup{grid-template-columns:1fr}.guest-mic-setup #guestTestMic,.guest-mic-setup .guest-test-note,.guest-mic-setup audio{grid-column:1}}
/* 9.9.1 mobile height fix: all controls remain reachable instead of cropping. */
@media(max-width:680px){
  .dj-page main{overflow:visible!important}
  .dj-page #console[data-view="radio"]{height:auto!important;min-height:calc(100dvh - 45px)!important;overflow:visible!important;display:flex!important;flex-direction:column!important;gap:5px!important}
  .dj-page #console[data-view="radio"] #consoleTop{flex:0 0 auto!important;position:sticky!important;top:0!important}
  .dj-page #console[data-view="radio"] #fxQuickStrip{flex:0 0 94px!important;height:94px!important;min-height:94px!important}
  .dj-page #console[data-view="radio"] #mixerPanel{flex:0 0 auto!important;min-height:0!important;height:auto!important}
  .dj-page #console[data-view="radio"] #broadcastPanel.radio-station{flex:0 0 auto!important;display:block!important;height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important}
  .dj-page #console[data-view="radio"] .station-workbench{display:flex!important;flex-direction:column!important;height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important}
  .dj-page #console[data-view="radio"] .station-workbench>.station-media{order:0!important;flex:0 0 auto!important;min-height:0!important;height:auto!important;max-height:none!important}
  .dj-page #console[data-view="radio"] .teaser-desk{display:flex!important;flex-direction:column!important;height:auto!important;min-height:385px!important;overflow:visible!important}
  .dj-page #console[data-view="radio"] #teaserEditor{height:clamp(320px,55dvh,600px)!important;min-height:320px!important;max-height:none!important;flex:1 0 auto!important}
  .dj-page #console[data-view="radio"] .station-workbench>.station-queue{order:1!important;min-height:0!important;max-height:none!important;height:auto!important;overflow:visible!important}
  .dj-page #console[data-view="radio"] .station-queue>.queue-list{min-height:100px!important;max-height:250px!important}
}
@media(max-width:680px){
 .dj-page #mixerPanel .mix-inline{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:6px!important;align-items:center!important;width:100%!important}
 .dj-page #mixerPanel .mix-title{grid-column:1/-1!important}
 .dj-page #mixerPanel label.mix-level{display:grid!important;flex:none!important;min-width:0!important;max-width:100%!important;width:100%!important;grid-column:auto!important;grid-template-columns:minmax(0,1fr) auto!important}
 .dj-page #mixerPanel label.mix-level input{min-width:0!important;width:100%!important}
 .dj-page #mixerPanel .mix-buttons{grid-column:1/-1!important;justify-content:space-between!important}
 .dj-page #mixerPanel .mix-duck{grid-column:1!important;min-width:0!important;white-space:normal!important}
 .dj-page #mixerPanel .mix-drawer{grid-column:2!important;justify-self:end!important}
}
@media(max-width:680px){html,body.dj-page{max-width:100%!important;overflow-x:clip!important}}
