body{background-color:#181818;color:#cccccc;font-family:"Noto Sans JP","Meiryo",sans-serif;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;margin:0;padding:0}.play-btn{background:none;border:none;cursor:pointer;width:150px;height:150px;transition:transform 0.2s ease-in-out}.play-btn:active{transform:scale(0.9)}.play-btn svg{width:100%;height:100%;transition:transform 0.3s ease-in-out}.play-btn.playing svg{transform:rotate(180deg)}#radio-title{font-size:14px;margin-top:10px;max-width:70%;word-wrap:break-word;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (max-width:600px){#radio-title{font-size:12px;max-width:80%}.play-btn{width:100px;height:100px}}.volume-container{width:200px;height:20px;background:#444;border-radius:10px;overflow:hidden;position:relative;display:inline-block}.volume-bar{width:0%;height:100%;background:limegreen;transition:width 0.1s linear}.set-volume-container{padding:1em}.popup-container{position:fixed;top:0%;bottom:0%;width:100%;height:100%;display:none;z-index:9999;background-color:rgba(0,0,0,0.5)}.popup-div{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#222;color:white;padding:20px;border-radius:12px;text-align:center;box-shadow:0 0 20px rgba(0,0,0,0.5);display:flex;flex-direction:column;align-items:center}.popup-div span{padding:6px}.popup-div input{margin:10px 0;padding:6px;border-radius:6px;border:none;width:100%}.popup-div button{padding:8px 12px;margin:5px;border:none;border-radius:6px;cursor:pointer;width:100%}.popup-div-cancel{background:#ff3300;color:white}.popup-div-submit{background:#009933;color:white}.loading-div{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#222;color:white;padding:20px;border-radius:12px;text-align:center;box-shadow:0 0 20px rgba(0,0,0,0.5);display:flex;flex-direction:column;align-items:center}.loading-div span{padding:5px}.loading-div img{padding:10px;width:100%}