.rn-mono-radio-player {display:flex; align-items:center; justify-content:center; flex-direction:column; gap:10px; min-height:70px; border:1px solid #eee; border-radius:15px; background-position:top center; background-repeat:no-repeat; background-size:cover;}
.rn-mono-radio-player .radio-name {font-weight:400; text-align:center; width:100%; text-transform:uppercase; margin:10px auto 0; font-size:14px; color:#666;}
.rn-mono-radio-player .rn-mono-radio-logo {margin:0; text-align:center;}
.rn-mono-radio-player .rn-mono-radio-logo img {max-height:60px; max-width:100%; width:auto; height:auto; display:inline-block; margin:0;}
.rn-mono-radio-player .radio-freq {font-size:0.9em; text-align:center; margin-bottom:10px; opacity:0.8;}
.rn-mono-player-controls {display:flex; align-items:center; justify-content:center; flex-direction:row; gap:5px; width:100%; padding:0 15px;}
.rn-mono-radio-player audio {display:none;}
.rn-mono-radio-player button {background-color:transparent; border: none; outline: none; margin:0; padding:0; font-size: 16px; cursor:pointer;}
.rn-mono-radio-player .rn-mono-toggle-button {background-color:#666; border: none; outline: none; margin:0 10px 0 0; padding: 0; width:44px; height:44px; flex-shrink:0; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor: pointer; transition:all 0.3s ease; position:relative;}
.rn-mono-radio-player .rn-mono-toggle-button::before,
.rn-mono-radio-player .rn-mono-toggle-button::after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; border-radius:50%; background-color:var(--rn-accent, #f00); opacity:0; transform:scale(1); pointer-events:none;}
.rn-mono-radio-player .rn-mono-toggle-button.active::before {animation: rn-mono-pulse 2s ease-out infinite;}
.rn-mono-radio-player .rn-mono-toggle-button.active::after {animation: rn-mono-pulse 2s ease-out 1s infinite;}
@keyframes rn-mono-pulse {0% {transform:scale(1); opacity:0.5;} 100% {transform:scale(2.2); opacity:0;}}
.rn-mono-radio-player .rn-mono-toggle-button .rn-mono-icon-play {color:#fff;}
.rn-mono-radio-player .rn-mono-toggle-button.active {background-color:var(--rn-accent, #f00);}
.rn-mono-radio-player .rn-mono-toggle-button.active .rn-mono-icon-stop {color:#fff;}
.rn-mono-radio-player .rn-mono-toggle-button:hover {opacity:0.8;}
.rn-mono-radio-player .rn-mono-icon-volume {color:#666; flex-shrink:0;}
.rn-mono-radio-player .rn-mono-mute-button {color:#666; padding:4px; transition:all 0.3s ease; flex-shrink:0;}
.rn-mono-radio-player .rn-mono-mute-button:hover {opacity:0.7;}
.rn-mono-radio-player .rn-mono-mute-button[data-muted="true"] {color:var(--rn-accent, #f00);}
.rn-mono-radio-player .rn-mono-controls {display:flex; align-items:center; flex:1; min-width:0;}
.rn-mono-radio-player .rn-mono-progress-bar {height:5px; background-color:#ccc; position: relative; flex-grow: 1; margin:0 10px; border-radius:3px; cursor:pointer;}
.rn-mono-radio-player .rn-mono-progress-bar-filled {height: 100%; position:absolute; top:0; left:0; background-color:#666; border-radius:3px;}
.rn-mono-radio-player .rn-mono-time {font-size:12px; white-space:nowrap; color:#666; min-width:90px; text-align:center;}
.rn-mono-radio-player .volume-control {display:flex; align-items: center; gap:5px; color:#666; flex:1; min-width:0;}
.rn-mono-radio-player .volume-slider-container {display:flex; align-items:center; position:relative; flex:1; min-width:0;}
.rn-mono-radio-player .volume-bar-filled {position:absolute; left:0; top:50%; transform:translateY(-50%); height:3px; background-color:#666; pointer-events:none; border-radius:2px;}
.rn-mono-radio-player .volume-slider {margin:0; width:100%;}
.rn-mono-radio-player .volume-slider::-webkit-slider-runnable-track {background:#ccc;}
.rn-mono-radio-player .volume-slider::-moz-range-track {background:#ccc;}
.rn-mono-radio-player .volume-slider::-ms-fill-upper {background:#ccc;}
.rn-mono-radio-player .volume-slider::before {width:var(--volume-before-width);}
.rn-mono-radio-player #mute-icon {margin:0 2.5%;}
.rn-mono-radio-player input[type="range"] {position: relative; -webkit-appearance: none; margin: 0; padding: 0; height: 19px; float: left; outline: none; border: 0; background: none; width:100%;}
.rn-mono-radio-player input[type="range"]::-webkit-slider-runnable-track {width: 100%; height: 3px; cursor: pointer;}
.rn-mono-radio-player input[type="range"]::before {position: absolute; content: ""; top: 8px; left: 0; width: var(--seek-before-width); height: 3px; background-color: #666; cursor: pointer;}
.rn-mono-radio-player input[type="range"]::-webkit-slider-thumb {position: relative; -webkit-appearance: none; box-sizing: content-box; border: 1px solid #666; height: 18px; width: 6px; border-radius: 2px; background-color: #666; cursor: pointer; margin: -8px 0 0 0;}
.rn-mono-radio-player input[type="range"]:active::-webkit-slider-thumb {transform: scale(1.2); background: #444;}
.rn-mono-radio-player input[type="range"]::-moz-range-track {width: 100%; height: 3px; cursor: pointer;}
.rn-mono-radio-player input[type="range"]::-moz-range-progress {background-color: #666;}
.rn-mono-radio-player input[type="range"]::-moz-focus-outer {border:0;}
.rn-mono-radio-player input[type="range"]::-moz-range-thumb {box-sizing: content-box; border: 1px solid #666; height: 18px; width: 6px; border-radius: 2px; background-color: #666; cursor: pointer;}
.rn-mono-radio-player input[type="range"]:active::-moz-range-thumb {transform: scale(1); background: #444;}
.rn-mono-radio-player input[type="range"]::-ms-track {width: 100%; height: 3px; cursor: pointer; background: transparent; border: solid transparent; color: transparent;}
.rn-mono-radio-player input[type="range"]::-ms-fill-lower {background-color: #666;}
.rn-mono-radio-player input[type="range"]::-ms-fill-upper {background: linear-gradient(to right, #666 var(--buffered-width), rgba(0, 125, 181, 0.2) var(--buffered-width));}
.rn-mono-radio-player input[type="range"]::-ms-thumb {box-sizing: content-box; border: 1px solid #666; height: 18px; width: 6px; border-radius: 2px; background-color: #666; cursor: pointer;}
.rn-mono-radio-player input[type="range"]:active::-ms-thumb {transform:scale(1.2); background:#444;}
.rn-mono-radio-player .rn-mono-equalizer-container {width:56px; height:56px; flex-shrink:0; display:flex; align-items:center; justify-content:center; position:relative;}
.rn-mono-image-container, .rn-mono-radio-player .pause-image {width: 56px; height: 56px; margin: 0; padding: 0; position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center;}
.rn-mono-radio-player .pause-image {display: none;}
.rn-mono-image-container svg.bouncing-bars {-webkit-transform: rotate(180deg); transform: rotate(180deg); width: 40px; height: 40px; margin: 0; padding: 0;}
.rn-mono-radio-player .pause-image svg.bouncing-bars-paused {width:40px; height: 40px; margin: 0; padding: 0; display:none;}

@-webkit-keyframes rn-mono-equalize{0%{height:60px}4%{height:50px}8%{height:40px}12%{height:30px}16%{height:20px}20%{height:30px}24%{height:40px}28%{height:10px}32%{height:40px}36%{height:60px}40%{height:20px}44%{height:40px}48%{height:70px}52%{height:30px}56%{height:10px}60%{height:30px}64%{height:50px}68%{height:60px}72%{height:70px}76%{height:80px}80%{height:70px}84%{height:60px}88%{height:50px}92%{height:60px}96%{height:70px}to{height:80px}}@keyframes rn-mono-equalize{0%{height:60px}4%{height:50px}8%{height:40px}12%{height:30px}16%{height:20px}20%{height:30px}24%{height:40px}28%{height:10px}32%{height:40px}36%{height:60px}40%{height:20px}44%{height:40px}48%{height:70px}52%{height:30px}56%{height:10px}60%{height:30px}64%{height:50px}68%{height:60px}72%{height:70px}76%{height:80px}80%{height:70px}84%{height:60px}88%{height:50px}92%{height:60px}96%{height:70px}to{height:80px}}

.rn-mono-image-container svg.bouncing-bars .bar {fill:var(--rn-accent, #f00); width:10px; -webkit-animation: rn-mono-equalize 2s steps(25) 0s infinite; animation: rn-mono-equalize 2s steps(25) 0s infinite; transition: all .2s;}
.rn-mono-image-container svg.bouncing-bars.out .bar {-webkit-animation: down 1.6s ease-in-out normal forwards; animation: down 1.6s ease-in-out normal forwards;}

.rn-mono-radio-player svg {overflow: hidden; vertical-align: top; display: block;}
.rn-mono-radio-player .pause-image svg.bouncing-bars-paused .bar-paused {fill:#666; transition:all .2s;}

/* Dark theme */
.rn-mono-radio-player.rn-mono-dark-theme .radio-name {color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme .rn-mono-toggle-button {background-color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme .rn-mono-toggle-button .rn-mono-icon-play {color:#333;}
.rn-mono-radio-player.rn-mono-dark-theme .rn-mono-toggle-button.active {background-color:var(--rn-accent, #f00);}
.rn-mono-radio-player.rn-mono-dark-theme .rn-mono-toggle-button.active .rn-mono-icon-stop {color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme .rn-mono-icon-volume {color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme .rn-mono-mute-button {color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme .rn-mono-mute-button[data-muted="true"] {color:var(--rn-accent, #f00);}
.rn-mono-radio-player.rn-mono-dark-theme .rn-mono-progress-bar-filled {background-color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme .rn-mono-time {color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme .volume-control {color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme .volume-slider::-webkit-slider-runnable-track {background:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme .volume-slider::-moz-range-track {background:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme .volume-slider::-ms-fill-upper {background:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme input[type="range"]::before {background-color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme input[type="range"]::-webkit-slider-thumb {border:1px solid #fff; background-color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme input[type="range"]:active::-webkit-slider-thumb {background:#ccc;}
.rn-mono-radio-player.rn-mono-dark-theme input[type="range"]::-moz-range-progress {background-color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme input[type="range"]::-moz-range-thumb {border:1px solid #fff; background-color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme input[type="range"]:active::-moz-range-thumb {background:#ccc;}
.rn-mono-radio-player.rn-mono-dark-theme input[type="range"]::-ms-fill-lower {background-color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme input[type="range"]::-ms-fill-upper {background:linear-gradient(to right, #fff var(--buffered-width), rgba(255, 255, 255, 0.2) var(--buffered-width));}
.rn-mono-radio-player.rn-mono-dark-theme input[type="range"]::-ms-thumb {border:1px solid #fff; background-color:#fff;}
.rn-mono-radio-player.rn-mono-dark-theme input[type="range"]:active::-ms-thumb {background:#ccc;}
.rn-mono-radio-player.rn-mono-dark-theme .pause-image svg.bouncing-bars-paused .bar-paused {fill:#fff;}

/* Responsive */
@media (max-width: 480px) {
    .rn-mono-radio-player {width:100% !important; border-radius:10px;}
    .rn-mono-player-controls {padding:0 8px; gap:4px;}
    .rn-mono-radio-player .rn-mono-toggle-button {width:38px; height:38px; margin:0 6px 0 0;}
    .rn-mono-radio-player .rn-mono-toggle-button .rn-mono-icon-play,
    .rn-mono-radio-player .rn-mono-toggle-button .rn-mono-icon-stop {width:22px; height:22px;}
    .rn-mono-radio-player .rn-mono-mute-button svg {width:18px; height:18px;}
    .rn-mono-radio-player .rn-mono-equalizer-container {width:40px; height:40px;}
    .rn-mono-image-container, .rn-mono-radio-player .pause-image {width:40px; height:40px;}
    .rn-mono-image-container svg.bouncing-bars {width:30px; height:30px;}
    .rn-mono-radio-player .pause-image svg.bouncing-bars-paused {width:30px; height:30px;}
    .rn-mono-radio-player .rn-mono-radio-logo img {max-height:40px;}
    .rn-mono-radio-player .radio-name {font-size:12px;}
    .rn-mono-radio-player .rn-mono-time {font-size:11px; min-width:70px;}
}