#ptt.sending{border-color:var(--green);box-shadow:0 0 18px #7ce626e6,0 0 54px #7ce62675,inset 0 0 35px #7ce62633;animation:talk-glow 1.15s ease-in-out infinite alternate}
.talk-zone:has(#ptt.sending) .dial{background:repeating-conic-gradient(from -1deg,var(--green) 0deg 1deg,transparent 1deg 5deg);animation:dial-spin 7s linear infinite}
.talk-zone:has(#ptt.sending) .dial-top,.talk-zone:has(#ptt.sending) .dial-bottom{color:var(--green)}
.talk-zone:has(#ptt.sending) .dial-top{font-size:0}.talk-zone:has(#ptt.sending) .dial-top:after{content:"ON AIR";font-size:16px}
.talk-zone:has(#ptt.sending) .dial-bottom{font-size:0}.talk-zone:has(#ptt.sending) .dial-bottom:after{content:"LIVE";font-size:16px}
@keyframes talk-glow{to{box-shadow:0 0 28px #7ce626,0 0 75px #7ce62694,inset 0 0 45px #7ce62640}}
@keyframes dial-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){#ptt.sending,.talk-zone:has(#ptt.sending) .dial{animation:none}}

.phone-busy-banner{display:none;margin-top:10px;padding:11px 15px;border:1px solid #8f642c;border-radius:16px;background:linear-gradient(145deg,#392a18,#2a2117);color:#ffc15c;font-size:13px;font-weight:800;box-shadow:0 0 18px #ffb34718}
.phone-busy-banner.show{display:block}
.phone-busy-banner:before{content:"☎";display:inline-grid;place-items:center;width:25px;height:25px;margin-right:8px;border-radius:50%;background:#ffc15c;color:#20170c}

/* iPhone 12 mini など幅が狭い端末向け */
@media(max-width:390px){
  #app{width:100%;overflow-x:hidden}
  header{height:62px;padding:7px 14px}
  .channel-title{gap:8px}
  .channel-title h1{font-size:18px}
  .channel-title small{font-size:9px}
  .people-mark{font-size:21px}
  .signal-dot{font-size:20px}
  .round{width:37px;height:37px;font-size:26px}
  nav{height:70px}
  nav button{padding:5px 2px 8px}
  nav button i{font-size:23px;line-height:25px}
  nav button span{font-size:10px}
  .view{padding:13px 14px}
  .member-summary{min-height:54px;padding:0 15px;border-radius:21px}
  .member-summary>span{font-size:12px}
  .member-summary>span b{font-size:17px}
  .member-summary strong{font-size:13px}
  .member-summary strong i{font-size:18px}
  .phone-busy-banner{font-size:11px;padding:8px 11px}
  .talk-zone{height:390px}
  .talk-status{top:17px;gap:7px;font-size:11px;white-space:nowrap}
  .dial{width:304px;height:304px}
  .dial:after{inset:20px}
  .dial-top,.dial-bottom{z-index:3;padding:0 7px;background:#020b19;font-size:12px}
  #ptt{width:228px;height:228px;border-width:7px}
  .mic-symbol{width:43px;height:59px;margin-bottom:8px;border-radius:24px}
  .mic-symbol:before{width:65px;height:47px;left:-11px;top:25px;border-width:6px;border-top:0;border-radius:0 0 38px 38px}
  .mic-symbol:after{width:6px;height:25px;left:19px;top:68px;box-shadow:-16px 20px 0 -1px white,16px 20px 0 -1px white}
  #ptt strong{margin-top:35px;font-size:22px}
  #ptt small{font-size:11px}
  .quick-settings{border-radius:16px}
  .quick-settings label{min-height:43px;font-size:11px}
}

@media(max-width:350px){
  .dial{width:280px;height:280px}
  #ptt{width:210px;height:210px}
  .talk-zone{height:365px}
}