/* === Efika v12: upload modal, bottom upload panel, responsive room player, autoplay polish === */
.room-main-grid-player-only{
  grid-template-columns:1fr!important;
  gap:0!important;
}
.player-panel-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  margin-bottom:4px!important;
}
.open-upload-modal-btn{
  white-space:nowrap!important;
  border-radius:999px!important;
}
.room-now-text{
  min-width:0!important;
}
.room-now-text h2,
#room-now-title{
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}
.room-upload-bottom{
  padding-top:10px!important;
  padding-bottom:34px!important;
}
.upload-panel-bottom{
  max-width:720px!important;
  margin:0 auto!important;
}
.ajax-upload-form,
.ajax-upload-form *{
  min-width:0;
}
.ajax-upload-form .form-field{
  width:100%!important;
  min-width:0!important;
}
.ajax-upload-form .input-emoji-shell{
  position:relative!important;
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
}
.ajax-upload-form .input-emoji-shell textarea,
.ajax-upload-form .input-emoji-shell input{
  box-sizing:border-box!important;
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  padding-right:72px!important;
  flex:none!important;
  transform:none!important;
  writing-mode:horizontal-tb!important;
  field-sizing:fixed!important;
  -webkit-appearance:none!important;
  appearance:none!important;
}
.ajax-upload-form textarea[name="user_comment"],
.ajax-upload-form textarea[name="user_comment"]:focus,
.ajax-upload-form textarea[name="user_comment"]:active{
  inline-size:100%!important;
  min-inline-size:0!important;
  max-inline-size:100%!important;
  height:104px!important;
  min-height:104px!important;
  max-height:104px!important;
  resize:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  font-size:16px!important;
  line-height:1.55!important;
}
.ajax-upload-form input[name="mood_tag"],
.ajax-upload-form input[name="mood_tag"]:focus,
.ajax-upload-form input[name="mood_tag"]:active{
  height:58px!important;
  min-height:58px!important;
  max-height:58px!important;
  font-size:16px!important;
  line-height:1.35!important;
}
.ajax-upload-form .input-emoji-shell .emoji-toggle{
  position:absolute!important;
  right:10px!important;
  top:10px!important;
  z-index:2!important;
  width:46px!important;
  min-width:46px!important;
  max-width:46px!important;
  height:46px!important;
  min-height:46px!important;
  max-height:46px!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.ajax-upload-form .upload-mood-row .emoji-toggle{
  top:6px!important;
}
.efika-modal.hidden{
  display:none!important;
}
.efika-modal{
  position:fixed!important;
  inset:0!important;
  z-index:900!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:18px!important;
}
.efika-modal-backdrop{
  position:absolute!important;
  inset:0!important;
  background:rgba(2,6,8,.72)!important;
  backdrop-filter:blur(10px)!important;
}
.efika-modal-card{
  position:relative!important;
  z-index:1!important;
  width:min(680px,100%)!important;
  max-height:min(88vh,760px)!important;
  overflow-y:auto!important;
  padding:28px!important;
  border-radius:28px!important;
  background:linear-gradient(145deg,rgba(32,40,44,.98),rgba(13,18,20,.98))!important;
  border:1px solid rgba(143,211,255,.18)!important;
  box-shadow:0 28px 90px rgba(0,0,0,.72)!important;
}
.efika-modal-card h2{
  margin:0 48px 18px 0!important;
  font-size:26px!important;
}
.efika-modal-close{
  position:absolute!important;
  top:7px!important;
  right:18px!important;
  width:42px!important;
  height:42px!important;
  border:0!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.08)!important;
  color:var(--text)!important;
  font-size:30px!important;
  line-height:1!important;
  cursor:pointer!important;
}
body.modal-open{
  overflow:hidden!important;
}
.emoji-picker-popup{
  transform:none!important;
}
@media (max-width:980px){
  .room-main-grid,
  .room-main-grid-player-only{
    grid-template-columns:1fr!important;
  }
}
@media (max-width:680px){
  .room-now-layout{
    grid-template-columns:96px minmax(0,1fr)!important;
    gap:14px!important;
    align-items:center!important;
  }
  .player-panel-head{
    align-items:flex-start!important;
  }
  .open-upload-modal-btn{
    padding:5px 8px!important;
    font-size:13px!important;
  }
  .player-panel .track-description{
    max-height:150px!important;
  }
  .efika-modal{
    align-items:flex-end!important;
    padding:10px!important;
  }
  .efika-modal-card{
    width:100%!important;
    max-height:92vh!important;
    padding:10px!important;
    border-radius:24px!important;
  }
}
@media (max-width:460px){
  .player-panel-head{
    flex-direction:column!important;
  }
  .open-upload-modal-btn{
    width:100%!important;
  }
  .room-now-layout{
    grid-template-columns:86px minmax(0,1fr)!important;
    gap:12px!important;
  }
  .track-cover{
    width:86px!important;
    height:86px!important;
    border-radius:18px!important;
  }
  #room-now-title{
    font-size:24px!important;
    line-height:1.15!important;
  }
}

/* === Efika v14: custom radio player, compact upload progress and fixed emoji popup === */
.native-room-audio,
.player-panel audio.native-room-audio{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
}
.player-panel{
  position:relative!important;
  overflow:hidden!important;
}
.player-panel-head{
  position:relative!important;
  z-index:2!important;
}
.room-now-layout{
  align-items:center!important;
  gap:20px!important;
}
.room-now-text{
  min-width:0!important;
  max-width:100%!important;
}
#room-now-meta{
  line-height:1.55!important;
}
.now-user-comment{
  display:block!important;
  margin-top:4px!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  color:#b9d0df!important;
}
.player-panel .track-description,
#room-now-description{
  max-height:168px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-right:8px!important;
  white-space:pre-wrap!important;
  scrollbar-width:thin!important;
}
.radio-control-row{
  display:flex!important;
  align-items:center!important;
  gap:16px!important;
  margin-top:18px!important;
  padding:18px!important;
  border-radius:24px!important;
  background:linear-gradient(145deg,rgba(8,13,16,.65),rgba(255,255,255,.035))!important;
  border:1px solid rgba(255,255,255,.07)!important;
}
.radio-play-button{
  width:76px!important;
  height:76px!important;
  min-width:76px!important;
  border:0!important;
  border-radius:50%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:pointer!important;
  background:#eef4f8!important;
  color:#061014!important;
  box-shadow:0 18px 40px rgba(0,0,0,.36)!important;
  transition:transform .15s ease, filter .15s ease!important;
}
.radio-play-button:hover{
  transform:scale(1.04)!important;
  filter:brightness(1.04)!important;
}
.radio-play-button.is-playing{
  background:linear-gradient(135deg,var(--accent),#5dd5ff)!important;
}
.radio-play-icon{
  font-size:28px!important;
  line-height:1!important;
  transform:translateX(2px)!important;
}
.radio-play-button.is-playing .radio-play-icon{
  font-size:24px!important;
  transform:none!important;
}
.radio-control-copy{
  display:flex!important;
  min-width:0!important;
  flex-direction:column!important;
  gap:4px!important;
}
.radio-control-copy strong{
  font-size:18px!important;
  color:#eaf5ff!important;
}
.radio-control-copy span{
  font-size:13px!important;
  line-height:1.35!important;
}
.radio-control-copy span.hidden{
  display:none!important;
}
.emoji-picker-popup{
  position:fixed!important;
  z-index:1400!important;
  max-width:calc(100vw - 24px)!important;
}
.track-upload-modal-card.upload-progress-state{
  width:min(440px,100%)!important;
  max-height:none!important;
  overflow:visible!important;
  text-align:center!important;
  padding:28px!important;
}
.track-upload-modal-card.upload-progress-state .efika-modal-close{
  display:none!important;
}
.track-upload-modal-card.upload-progress-state .form-field,
.track-upload-modal-card.upload-progress-state .file-form-field,
.track-upload-modal-card.upload-progress-state .selected-file-name,
.track-upload-modal-card.upload-progress-state .ajax-upload-form > .btn{
  display:none!important;
}
.track-upload-modal-card.upload-progress-state .ajax-upload-form{
  gap:18px!important;
}
.track-upload-modal-card.upload-progress-state .upload-progress{
  display:flex!important;
  margin-top:0!important;
}
.track-upload-modal-card.upload-progress-state .form-status{
  display:block!important;
  margin:0!important;
  font-size:17px!important;
  line-height:1.45!important;
  color:#dce8f2!important;
}
.track-upload-modal-card.upload-success-state .upload-progress-head span{
  color:var(--accent-2)!important;
}
.track-upload-modal-card.upload-progress-state .upload-ack-button{
  display:inline-flex!important;
  width:auto!important;
  min-width:150px!important;
  align-self:center!important;
  justify-content:center!important;
  margin:0 auto!important;
}
.track-upload-modal-card.upload-progress-state .upload-ack-button.hidden{
  display:none!important;
}
.efika-confirm-card{
  width:min(430px,calc(100vw - 28px))!important;
}
.efika-confirm-message{
  margin:0!important;
  color:#dce8f2!important;
  font-size:17px!important;
  line-height:1.45!important;
}
@media (min-width:860px){
  .player-panel{
    padding:30px!important;
  }
  .room-now-layout{
    grid-template-columns:152px minmax(0,1fr)!important;
  }
  .player-panel .track-cover,
  .room-now-layout .track-cover{
    width:152px!important;
    height:152px!important;
    border-radius:26px!important;
  }
  #room-now-title{
    font-size:34px!important;
    line-height:1.12!important;
  }
}
@media (max-width:680px){
  .radio-control-row{
    padding:14px!important;
  }
  .radio-play-button{
    width:62px!important;
    height:62px!important;
    min-width:62px!important;
  }
  .radio-play-icon{
    font-size:23px!important;
  }
  .room-now-layout{
    grid-template-columns:96px minmax(0,1fr)!important;
  }
}


/* === Efika v16: stronger room autoplay, slower player ring, clickable player block === */
.efika-global-audio{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
}

.room-now-layout[data-audio-toggle-surface],
.radio-control-row[data-audio-toggle-surface],
.now-card-player[data-audio-toggle-surface]{
  cursor:pointer!important;
}

.room-now-layout[data-audio-toggle-surface]:hover .track-cover,
.now-card-player[data-audio-toggle-surface]:hover .track-cover{
  box-shadow:0 0 0 1px rgba(143,211,255,.18), 0 18px 48px rgba(0,0,0,.28)!important;
}

#room-now-title{
  max-width:100%!important;
  font-size:clamp(24px,3.1vw,34px)!important;
}

.radio-control-row{
  position:relative!important;
  isolation:isolate!important;
  justify-content:space-between!important;
  gap:18px!important;
  overflow:visible!important;
  border:0!important;
  background:
    radial-gradient(circle at 88% 50%, rgba(143,211,255,.16), transparent 33%),
    radial-gradient(circle at 16% 0%, rgba(0,196,140,.11), transparent 42%),
    linear-gradient(145deg,rgba(6,10,13,.88),rgba(22,30,34,.82))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -1px 0 rgba(0,0,0,.32),
    0 18px 48px rgba(0,0,0,.28)!important;
}

.radio-control-row:before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:-1!important;
  border-radius:inherit!important;
  background-image:
    linear-gradient(115deg,rgba(255,255,255,.035),transparent 28%,rgba(143,211,255,.06) 52%,transparent 78%),
    repeating-linear-gradient(135deg,rgba(255,255,255,.025) 0 1px,transparent 1px 8px)!important;
  opacity:.75!important;
  pointer-events:none!important;
}

.radio-control-copy{
  order:1!important;
  flex:1 1 auto!important;
  min-width:0!important;
}

.radio-control-copy strong{
  font-size:clamp(18px,2.2vw,23px)!important;
  letter-spacing:.01em!important;
}

.radio-play-button{
  order:2!important;
  margin-left:auto!important;
  position:relative!important;
  isolation:isolate!important;
  overflow:visible!important;
  border:0!important;
  outline:0!important;
  background:
    radial-gradient(circle at 35% 28%,#ffffff 0,#e8f5ff 34%,#7fd4ff 100%)!important;
  color:#061014!important;
  box-shadow:
    0 18px 45px rgba(0,0,0,.42),
    0 0 34px rgba(143,211,255,.22),
    inset 0 -10px 18px rgba(3,15,22,.10),
    inset 0 8px 18px rgba(255,255,255,.42)!important;
}

.radio-play-button:before{
  content:""!important;
  position:absolute!important;
  inset:-8px!important;
  border-radius:50%!important;
  padding:3px!important;
  background:
    conic-gradient(from 0deg, transparent 0 26%, rgba(143,211,255,.98) 34%, rgba(0,196,140,.98) 50%, rgba(255,255,255,.86) 62%, transparent 74% 100%)!important;
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0)!important;
  -webkit-mask-composite:xor!important;
  mask-composite:exclude!important;
  animation:efika-player-ring 4.8s linear infinite!important;
  opacity:.95!important;
  pointer-events:none!important;
}

.radio-play-button:after{
  content:""!important;
  position:absolute!important;
  inset:-18px!important;
  z-index:-2!important;
  border-radius:50%!important;
  background:
    radial-gradient(circle,rgba(143,211,255,.27),rgba(0,196,140,.11) 42%,transparent 70%)!important;
  animation:efika-player-pulse 3.6s ease-in-out infinite!important;
  pointer-events:none!important;
}

.radio-play-button.is-playing:before{
  animation-duration:2.1s!important;
}

.radio-play-button.is-playing{
  background:
    radial-gradient(circle at 36% 28%,#dff5ff 0,#79d7ff 39%,#00c48c 100%)!important;
}

.radio-play-icon{
  position:relative!important;
  z-index:1!important;
  text-shadow:0 1px 0 rgba(255,255,255,.28)!important;
}

@keyframes efika-player-ring{
  to{transform:rotate(360deg)}
}

@keyframes efika-player-pulse{
  0%,100%{transform:scale(.92);opacity:.55}
  50%{transform:scale(1.08);opacity:.95}
}

.now-card-player{
  grid-template-columns:132px minmax(0,1fr) auto!important;
  gap:18px!important;
  align-items:center!important;
}

.now-card-copy{
  min-width:0!important;
}

.hero-audio-state{
  display:inline-flex!important;
  width:max-content!important;
  margin:8px 0 0!important;
  padding:6px 10px!important;
  border-radius:999px!important;
  background:rgba(143,211,255,.12)!important;
  color:#dff3ff!important;
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:.05em!important;
}

.hero-radio-play-button{
  width:58px!important;
  height:58px!important;
  min-width:58px!important;
}

.hero-radio-play-button .radio-play-icon{
  font-size:22px!important;
}

.track-upload-modal-card.upload-progress-state .form-status{
  font-weight:900!important;
}

@media (max-width:560px){
  .player-panel{
    padding:18px!important;
    border-radius:24px!important;
  }

  .player-panel-head{
    gap:10px!important;
    margin-bottom:0!important;
  }

  .live-dot{
    padding:4px 7px!important;
    font-size:12px!important;
  }

  .open-upload-modal-btn{
    max-width:210px!important;
    white-space:normal!important;
    text-align:center!important;
    line-height:1.15!important;
  }

  .room-now-layout{
    grid-template-columns:76px minmax(0,1fr)!important;
    gap:10px!important;
    align-items:center!important;
  }

  .player-panel .track-cover,
  .room-now-layout .track-cover,
  .track-cover{
    width:76px!important;
    height:76px!important;
    min-width:76px!important;
    border-radius:17px!important;
    font-size:29px!important;
  }

  #room-now-title{
    font-size:clamp(20px,5.3vw,24px)!important;
    line-height:1.12!important;
    letter-spacing:-.03em!important;
    margin:0 0 7px!important;
  }

  #room-now-meta{
    font-size:13px!important;
    line-height:1.34!important;
  }

  .now-user-comment{
    margin-top:3px!important;
    font-size:13px!important;
    line-height:1.32!important;
  }

  #room-now-description{
    display:none!important;
  }

  .radio-control-row{
    margin-top:14px!important;
    padding:12px!important;
    border-radius:22px!important;
    gap:12px!important;
  }

  .radio-control-copy strong{
    font-size:18px!important;
  }

  .radio-control-copy span{
    font-size:12px!important;
  }

  .radio-play-button{
    width:58px!important;
    height:58px!important;
    min-width:58px!important;
  }

  .radio-play-button:before{
    inset:-7px!important;
  }

  .radio-play-button:after{
    inset:-14px!important;
  }

  .now-card-player{
    grid-template-columns:82px minmax(0,1fr) 54px!important;
    gap:12px!important;
  }

  .hero-radio-play-button{
    width:54px!important;
    height:54px!important;
    min-width:54px!important;
  }
}

@media (max-width:400px){
  .room-now-layout{
    grid-template-columns:66px minmax(0,1fr)!important;
    gap:9px!important;
  }

  .player-panel .track-cover,
  .room-now-layout .track-cover,
  .track-cover{
    width:66px!important;
    height:66px!important;
    min-width:66px!important;
    border-radius:15px!important;
    font-size:25px!important;
  }

  #room-now-title{
    font-size:20px!important;
  }

  .radio-play-button{
    width:54px!important;
    height:54px!important;
    min-width:54px!important;
  }
}

/* === Efika v17: strict now-playing layout, slower player button, cleaner room/player controls === */
:root{
  --player-ring-idle-speed:19.2s;
  --player-ring-live-speed:4.2s;
  --player-pulse-idle-speed:14.4s;
  --player-pulse-live-speed:7.2s;
  --player-button-size:76px;
  --player-button-size-mobile:58px;
}

.player-panel-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
}

.now-card-strict{
  justify-content:center!important;
}

.room-now-layout,
.now-card-player{
  display:grid!important;
  grid-template-columns:clamp(104px,15vw,150px) minmax(0,1fr)!important;
  grid-template-areas:
    "poster text"
    "description description"!important;
  align-items:start!important;
  gap:18px 22px!important;
}

.now-card-player{
  grid-template-areas:
    "poster text"
    "description description"
    "controls controls"!important;
}

.room-now-layout .track-cover,
.now-card-player > .track-cover{
  grid-area:poster!important;
  width:clamp(104px,15vw,150px)!important;
  height:clamp(104px,15vw,150px)!important;
  min-width:0!important;
  border-radius:24px!important;
  align-self:start!important;
}

.room-now-text,
.now-card-copy{
  grid-area:text!important;
  min-width:0!important;
  align-self:start!important;
}

#room-now-title,
.now-card-copy h2{
  margin:0 0 12px!important;
  max-width:100%!important;
  font-size:clamp(25px,3.3vw,27px)!important;
  line-height:1.0!important;
  letter-spacing:-.045em!important;
  overflow-wrap:anywhere!important;
}

#room-now-meta,
.now-track-meta,
.now-card-copy p{
  margin:0!important;
  color:var(--muted)!important;
  font-size:clamp(14px,1.65vw,17px)!important;
  line-height:1.45!important;
  overflow-wrap:anywhere!important;
}

.now-user-comment{
  display:block!important;
  margin-top:8px!important;
  color:#dce8f2!important;
  line-height:1.45!important;
}

.room-now-layout .track-description,
.now-card-player .track-description,
#room-now-description{
  grid-area:description!important;
  display:block!important;
  margin:2px 0 0!important;
  padding:0 12px 0 0!important;
  max-height:170px!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  color:#aeb9c2!important;
  font-size:clamp(15px,1.75vw,17px)!important;
  line-height:1.55!important;
  scrollbar-width:thin!important;
}

.room-now-layout .track-description:empty,
.now-card-player .track-description:empty,
#room-now-description:empty{
  display:none!important;
}

.room-now-layout .track-description::-webkit-scrollbar,
.now-card-player .track-description::-webkit-scrollbar,
#room-now-description::-webkit-scrollbar{
  width:5px!important;
}

.room-now-layout .track-description::-webkit-scrollbar-thumb,
.now-card-player .track-description::-webkit-scrollbar-thumb,
#room-now-description::-webkit-scrollbar-thumb{
  background:rgba(220,232,242,.32)!important;
  border-radius:999px!important;
}

.hero-radio-control{
  grid-area:controls!important;
  width:100%!important;
  margin-top:8px!important;
}

.radio-control-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  min-height:112px!important;
  padding:18px 20px!important;
  border:0!important;
  outline:0!important;
}

.radio-control-copy{
  min-width:0!important;
  padding-right:14px!important;
}

.radio-play-button{
  width:var(--player-button-size)!important;
  height:var(--player-button-size)!important;
  min-width:var(--player-button-size)!important;
  border:0!important;
  outline:0!important;
  box-shadow:
    0 22px 48px rgba(0,0,0,.50),
    0 8px 22px rgba(0,196,140,.18),
    0 0 42px rgba(143,211,255,.26),
    inset 0 13px 20px rgba(255,255,255,.56),
    inset 0 -14px 22px rgba(4,20,26,.20)!important;
  background:
    radial-gradient(circle at 32% 24%,#ffffff 0,#eefaff 23%,#91e4ff 48%,#30d8c2 100%)!important;
  transform:translateZ(0)!important;
}

.radio-play-button:hover{
  filter:none!important;
  transform:translateY(-1px)!important;
  box-shadow:
    0 26px 56px rgba(0,0,0,.54),
    0 10px 28px rgba(0,196,140,.24),
    0 0 52px rgba(143,211,255,.34),
    inset 0 14px 22px rgba(255,255,255,.62),
    inset 0 -15px 24px rgba(4,20,26,.20)!important;
}

.radio-play-button:before{
  animation-duration:var(--player-ring-idle-speed)!important;
  opacity:.78!important;
}

.radio-play-button:after{
  animation-duration:var(--player-pulse-idle-speed)!important;
  opacity:.70!important;
}

.radio-play-button.is-playing:before{
  animation-duration:var(--player-ring-live-speed)!important;
  opacity:.92!important;
}

.radio-play-button.is-playing:after{
  animation-duration:var(--player-pulse-live-speed)!important;
  opacity:.82!important;
}

.radio-play-button.is-playing{
  background:
    radial-gradient(circle at 32% 24%,#ffffff 0,#dff8ff 22%,#79d7ff 45%,#00c48c 100%)!important;
}

.hero-radio-play-button{
  width:64px!important;
  height:64px!important;
  min-width:64px!important;
}

@media (max-width:680px){
  .player-panel{
    padding:18px!important;
  }

  .room-now-layout,
  .now-card-player{
    grid-template-columns:88px minmax(0,1fr)!important;
    gap:14px 14px!important;
  }

  .room-now-layout .track-cover,
  .now-card-player > .track-cover,
  .track-cover{
    width:88px!important;
    height:88px!important;
    min-width:88px!important;
    border-radius:18px!important;
  }

  #room-now-title,
  .now-card-copy h2{
    font-size:clamp(22px,6vw,28px)!important;
    line-height:1.12!important;
    margin-bottom:8px!important;
  }

  #room-now-meta,
  .now-track-meta,
  .now-card-copy p{
    font-size:14px!important;
    line-height:1.38!important;
  }

  .room-now-layout .track-description,
  .now-card-player .track-description,
  #room-now-description{
    display:block!important;
    max-height:145px!important;
    font-size:15px!important;
    line-height:1.5!important;
  }

  .radio-control-row{
    min-height:96px!important;
    padding:14px!important;
    gap:12px!important;
  }

  .radio-play-button{
    width:var(--player-button-size-mobile)!important;
    height:var(--player-button-size-mobile)!important;
    min-width:var(--player-button-size-mobile)!important;
  }

  .hero-radio-play-button{
    width:56px!important;
    height:56px!important;
    min-width:56px!important;
  }
}

@media (max-width:420px){
  .room-now-layout,
  .now-card-player{
    grid-template-columns:76px minmax(0,1fr)!important;
    gap:12px 12px!important;
  }

  .room-now-layout .track-cover,
  .now-card-player > .track-cover,
  .track-cover{
    width:76px!important;
    height:76px!important;
    min-width:76px!important;
    border-radius:16px!important;
  }

  #room-now-title,
  .now-card-copy h2{
    font-size:21px!important;
  }

  .room-now-layout .track-description,
  .now-card-player .track-description,
  #room-now-description{
    max-height:132px!important;
  }
}

/* === Efika v18: centered mobile modals, live badge on main player, airtime and metadata tabs === */
.now-card-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  margin:0 0 18px!important;
}

.now-card-strict .now-card-body,
.now-card-player{
  width:100%!important;
}

.track-release-year{
  min-height:18px!important;
  margin:0 0 7px!important;
  color:var(--accent)!important;
  font-size:13px!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
}

.track-release-year:empty{
  display:none!important;
}

.now-tabs-shell{
  grid-area:description!important;
  display:block!important;
  width:100%!important;
  min-width:0!important;
  margin-top:2px!important;
}

.now-tabs{
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
  min-width:0!important;
}

.now-tab-list{
  display:flex!important;
  gap:8px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding:1px 0 4px!important;
  scrollbar-width:thin!important;
}

.now-tab-button{
  flex:0 0 auto!important;
  border:1px solid rgba(143,211,255,.16)!important;
  border-radius:999px!important;
  padding:8px 12px!important;
  background:rgba(255,255,255,.055)!important;
  color:#aeb9c2!important;
  font-size:13px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.02em!important;
  cursor:pointer!important;
  white-space:nowrap!important;
}

.now-tab-button.is-active{
  background:linear-gradient(135deg,rgba(143,211,255,.22),rgba(0,196,140,.18))!important;
  border-color:rgba(143,211,255,.36)!important;
  color:#eaf7ff!important;
  box-shadow:0 8px 20px rgba(0,0,0,.20)!important;
}

.now-tab-panels{
  min-width:0!important;
}

.now-tab-panel{
  display:none!important;
  max-height:176px!important;
  min-height:74px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:1px 12px 1px 0!important;
  color:#aeb9c2!important;
  font-size:clamp(15px,1.75vw,17px)!important;
  line-height:1.55!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  scrollbar-width:thin!important;
}

.now-tab-panel.is-active{
  display:block!important;
}

.now-tab-panel::-webkit-scrollbar,
.now-tab-list::-webkit-scrollbar{
  width:5px!important;
  height:5px!important;
}

.now-tab-panel::-webkit-scrollbar-thumb,
.now-tab-list::-webkit-scrollbar-thumb{
  background:rgba(220,232,242,.32)!important;
  border-radius:999px!important;
}

.radio-control-copy [data-air-time]{
  display:block!important;
  margin-top:4px!important;
  font-variant-numeric:tabular-nums!important;
  color:#a9c4d8!important;
}

.radio-control-copy [data-air-time] + span{
  margin-top:3px!important;
}

@media (max-width:680px){
  .efika-modal{
    align-items:center!important;
    justify-content:center!important;
    min-height:100dvh!important;
    overflow-y:auto!important;
    padding:14px!important;
  }

  .efika-modal-card{
    margin:auto!important;
    max-height:min(92dvh,760px)!important;
  }

  .track-upload-modal-card.upload-progress-state{
    margin:auto!important;
  }

  .now-card-head{
    margin-bottom:14px!important;
  }

  .now-tabs-shell{
    margin-top:0!important;
  }

  .now-tab-button{
    padding:8px 10px!important;
    font-size:12px!important;
  }

  .now-tab-panel{
    max-height:148px!important;
    min-height:72px!important;
    font-size:16px!important;
    line-height:1.5!important;
  }
}

@media (max-width:420px){
  .efika-modal{
    padding:12px!important;
  }

  .efika-modal-card{
    width:min(100%,420px)!important;
    border-radius:22px!important;
  }

  .track-release-year{
    font-size:12px!important;
    margin-bottom:5px!important;
  }

  .now-tab-panel{
    max-height:136px!important;
  }
}


/* === Efika v245: пользовательская кнопка AI Коммент в окне постановки трека === */
.upload-comment-label-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin-bottom:6px!important;
}
.upload-comment-label-row label{
  margin:0!important;
}
.upload-ai-comment-tools{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  flex:0 0 auto!important;
}
.ai-comment-button,
.ai-comment-help-button{
  border:1px solid rgba(143,211,255,.32)!important;
  background:rgba(143,211,255,.12)!important;
  color:var(--text)!important;
  border-radius:999px!important;
  cursor:pointer!important;
  box-shadow:none!important;
}
.ai-comment-button{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  height:25px!important;
  min-height:25px!important;
  padding:2px 8px!important;
  font-size:12px!important;
  line-height:1!important;
  white-space:nowrap!important;
}
.ai-comment-button b{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:18px!important;
  height:18px!important;
  padding:0 5px!important;
  border-radius:999px!important;
  background:rgba(143,211,255,.24)!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:800!important;
}
.ai-comment-button.is-last{
  border-color:rgba(255,95,109,.62)!important;
  background:rgba(255,95,109,.16)!important;
}
.ai-comment-button.is-last b{
  background:rgba(255,95,109,.42)!important;
}
.ai-comment-button:disabled{
  opacity:.52!important;
  cursor:not-allowed!important;
}
.ai-comment-button.is-loading b{
  min-width:34px!important;
}
.ai-comment-button.is-loading b::after{
  content:'…';
}
.ai-comment-help-button{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:24px!important;
  height:24px!important;
  min-width:24px!important;
  padding:0!important;
  font-size:13px!important;
  font-weight:800!important;
}
.ai-comment-inline-status{
  display:block!important;
  min-height:16px!important;
  margin-top:4px!important;
  font-size:12px!important;
  line-height:1.25!important;
}
.ai-comment-inline-status.error{
  color:var(--danger)!important;
}
.ai-comment-inline-status.success{
  color:var(--accent-2)!important;
}
.ai-comment-inline-status.warning{
  color:var(--warning)!important;
}
.ai-comment-help-card{
  max-width:640px!important;
}
.ai-comment-help-body{
  display:grid!important;
  gap:10px!important;
  max-height:min(68vh,620px)!important;
  overflow:auto!important;
  padding-right:3px!important;
}
.ai-comment-help-body p{
  margin:0 0 10px!important;
  color:var(--muted)!important;
}
.ai-comment-help-body p b{
  color:var(--text)!important;
}
.ai-comment-help-section{
  padding:12px 14px!important;
  border-radius:18px!important;
  border:1px solid rgba(143,211,255,.16)!important;
  background:rgba(255,255,255,.035)!important;
}
.ai-comment-help-section h3{
  margin:0 0 8px!important;
  font-size:15px!important;
  line-height:1.2!important;
  color:var(--text)!important;
}
.ai-comment-help-section ul{
  margin:0!important;
  padding-left:18px!important;
  color:var(--muted)!important;
}
.ai-comment-help-section li{
  margin:0 0 6px!important;
  line-height:1.45!important;
}
.ai-comment-help-section li:last-child{
  margin-bottom:0!important;
}
.ai-comment-auto-toggle{
  display:flex!important;
  align-items:flex-start!important;
  gap:8px!important;
  margin-top:12px!important;
  padding:10px 12px!important;
  border-radius:16px!important;
  border:1px solid rgba(143,211,255,.2)!important;
  background:rgba(255,255,255,.04)!important;
}
.ai-comment-auto-toggle.hidden{
  display:none!important;
}

/* === Efika v245: админка пользовательских AI-комментариев === */
.admin-ai-comments-form{
  display:grid!important;
  gap:18px!important;
}
.admin-ai-comment-main-grid textarea{
  min-height:116px!important;
}
.admin-ai-comment-quota-table input,
.admin-ai-comment-quota-table select,
.admin-ai-comment-bonus-table input,
.admin-ai-comment-bonus-table select{
  min-width:82px!important;
}
.admin-ai-comment-bonus-table input[name^="bonus_title_"]{
  min-width:170px!important;
}
.admin-ai-comment-bonus-table input[name^="bonus_reaction_types_"]{
  min-width:110px!important;
}
.admin-ai-comment-stats-panel .admin-form-actions{
  margin-top:14px!important;
}

@media (max-width:520px){
  .upload-comment-label-row{
    align-items:flex-start!important;
  }
  .ai-comment-button span{
    max-width:82px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .ai-comment-button{
    padding-left:7px!important;
    padding-right:6px!important;
  }
}

/* === Efika v246: мобильное выравнивание кнопки AI Коммент строго справа от подписи === */
.upload-comment-label-row{
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
}
.upload-comment-label-row > label{
  display:block!important;
  width:auto!important;
  min-width:0!important;
  flex:1 1 auto!important;
  margin:0!important;
}
.upload-ai-comment-tools{
  margin-left:auto!important;
  flex:0 0 auto!important;
}

@media (max-width:520px){
  .upload-comment-label-row{
    align-items:center!important;
    gap:8px!important;
  }
  .upload-ai-comment-tools{
    margin-left:auto!important;
  }
}
