
#rr-four{padding:10px;font-family:Arial,sans-serif}#rr-four *{box-sizing:border-box}#rr-four .rr-stage{background:#08090d;color:#f4f0ec;border-radius:22px;padding:26px 20px}#rr-four .rr-heading{text-align:center;margin-bottom:23px}#rr-four .rr-heading h2{font:400 clamp(21px,4vw,30px) Georgia,serif;margin:0 0 9px}#rr-four .rr-heading p{font-size:11px;letter-spacing:2px;color:#b7ada5;margin:0}#rr-four .rr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}#rr-four .rr-channel{--tone:#d9ac5b;--rgb:217,172,91;background:linear-gradient(145deg,#17161a,#0b0b10);border:1px solid #3a3538;border-radius:16px;overflow:hidden;transition:border-color .5s,box-shadow .5s}#rr-four .rr-channel.on{border-color:var(--tone);box-shadow:0 0 30px rgba(var(--rgb),.12)}#rr-four .rr-upper{padding:14px 15px 0;display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:1.3px;color:#aaa0a1}#rr-four .rr-state{color:var(--tone)}#rr-four .rr-art{position:relative;height:162px;background:radial-gradient(ellipse at center,rgba(var(--rgb),.09),transparent 68%)}#rr-four canvas{display:block;width:100%;height:100%}#rr-four .rr-symbol{position:absolute;left:50%;top:47%;width:114px;height:114px;transform:translate(-50%,-50%);object-fit:contain;mix-blend-mode:screen;filter:hue-rotate(var(--hue)) drop-shadow(0 0 6px rgba(var(--rgb),.2))}#rr-four .rr-name{text-align:center;font:500 22px Arial,sans-serif;letter-spacing:2px;color:var(--tone);margin:-7px 0 5px;text-shadow:0 0 15px rgba(var(--rgb),.18)}#rr-four .rr-tag{text-align:center;font-size:9px;letter-spacing:1.4px;color:#b9afb1;margin:0 12px 16px}#rr-four .rr-song{text-align:center;padding:0 12px;min-height:49px}#rr-four .rr-title{font:400 19px Georgia,serif;color:#f7f1eb;margin:0 0 5px}#rr-four .rr-artist{font:11px Arial,sans-serif;color:#bcb2af;letter-spacing:1px}#rr-four .rr-track{height:2px;background:#333038;margin:17px 20px 7px}#rr-four .rr-fill{height:100%;width:0;background:var(--tone);box-shadow:0 0 8px rgba(var(--rgb),.7)}#rr-four .rr-time{display:flex;justify-content:space-between;padding:0 20px;font-size:9px;color:#a99f9d;font-variant-numeric:tabular-nums}#rr-four .rr-controls{display:flex;justify-content:center;padding:13px 0 18px}#rr-four button{border:1px solid #665a59;background:#201d22;color:#e8ded9;border-radius:30px;padding:11px 21px;font:12px Arial,sans-serif;min-height:44px;transition:background .4s,box-shadow .4s}#rr-four .on button{background:#f6f0e9;color:#1e1719;border-color:#f6f0e9;box-shadow:0 0 22px rgba(var(--rgb),.25)}#rr-four button:focus-visible{outline:2px solid var(--tone);outline-offset:4px}#rr-four .rr-foot{border-top:1px solid #363038;padding:10px;text-align:center;font-size:9px;letter-spacing:1px;color:#a99f9d}#rr-four .rr-demo{text-align:center;color:#a99f9d;font-size:11px;margin:20px 0 0;line-height:1.5}@media(max-width:490px){#rr-four{padding:3px}#rr-four .rr-stage{padding:20px 12px}#rr-four .rr-grid{grid-template-columns:1fr}#rr-four .rr-art{height:174px}#rr-four .rr-symbol{width:127px;height:127px}}

#rr-four .rr-channel{background:radial-gradient(ellipse at 50% 27%,rgba(var(--rgb),.08),transparent 60%),linear-gradient(145deg,#1a171b,#090a0f 70%);border-color:#635548;box-shadow:inset 0 1px 0 #fff0df0c}
#rr-four .rr-channel.on{box-shadow:0 0 28px rgba(var(--rgb),.16),inset 0 0 26px rgba(var(--rgb),.04)}
#rr-four .rr-art{height:182px;background:radial-gradient(ellipse at 50% 60%,rgba(var(--rgb),.14),transparent 65%)}
#rr-four .rr-symbol{z-index:2;width:136px;height:136px;mix-blend-mode:screen;filter:hue-rotate(var(--hue)) drop-shadow(0 0 8px rgba(var(--rgb),.28))}
#rr-four .rr-art:after{content:'';position:absolute;bottom:10px;left:22%;right:22%;height:1px;background:linear-gradient(90deg,transparent,#f2d093,transparent);box-shadow:0 0 12px #ebb46866;pointer-events:none}
#rr-four .rr-name{font-size:24px;letter-spacing:2.5px;text-shadow:0 0 20px rgba(var(--rgb),.22)}
#rr-four .rr-track{position:relative;height:3px;margin:22px 23px 12px;background:linear-gradient(90deg,#524031,#292933);border-radius:3px;overflow:visible}
#rr-four .rr-fill{position:relative;border-radius:3px;background:linear-gradient(90deg,var(--tone),#f3d19c);box-shadow:0 0 8px rgba(var(--rgb),.65)}
#rr-four .rr-pick{position:absolute;left:0;top:50%;width:19px;height:23px;transform:translate(-50%,-43%);filter:drop-shadow(0 0 5px rgba(var(--rgb),.7));pointer-events:none}
#rr-four .rr-pick:before{content:'';position:absolute;inset:0;clip-path:polygon(18% 0,82% 0,100% 20%,94% 49%,73% 79%,50% 100%,27% 79%,6% 49%,0 20%);background:linear-gradient(135deg,#fff1cb 0%,#d8a34c 28%,#ffe5b1 45%,#b8772d 75%,#f7d9a3);border-radius:7px}
#rr-four .rr-pick:after{content:'R';position:absolute;left:0;right:0;top:2px;text-align:center;color:#57361b;font:bold 10px Georgia,serif}
#rr-four button{padding:12px 24px;border-color:rgba(var(--rgb),.55);background:#19161d;min-width:125px;box-shadow:inset 0 0 9px rgba(var(--rgb),.08)}
#rr-four .on button{background:linear-gradient(145deg,#f8f0e4,#dfd0bc);color:#251c1c;border-color:#ffe5bb;animation:rr-neon-breathe 2.8s ease-in-out infinite}
#rr-four .rr-foot{border-color:#72583555;color:#bcb0a0}
@keyframes rr-neon-breathe{0%,100%{box-shadow:0 0 7px rgba(var(--rgb),.32),0 0 19px rgba(var(--rgb),.16)}50%{box-shadow:0 0 12px rgba(var(--rgb),.9),0 0 33px rgba(var(--rgb),.5),0 0 50px rgba(var(--rgb),.18)}}
@media(prefers-reduced-motion:reduce){#rr-four .on button{animation:none;box-shadow:0 0 14px rgba(var(--rgb),.4)}}

#radio-player{display:block;position:relative;width:calc(100% - 24px);max-width:1000px;padding:0;margin:28px auto;background:transparent;border:0;color:#f4f0ec}#rr-four button{cursor:pointer}#rr-four .rr-heading{display:flex;flex-direction:column;align-items:center;gap:10px}#rr-four .rr-heading h2{margin:0}#rr-four .rr-title{min-height:23px;overflow-wrap:anywhere}#rr-four .rr-song{min-height:66px}#rr-four .rr-global{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:16px;padding:20px 0 0;font-size:12px;color:#bdb1aa}#rr-four #audio-status{position:static;text-align:center;flex-basis:100%;width:auto;margin:0;font-size:12px;color:#d1c5b8}#rr-four #audio-volume{accent-color:#dfb569;width:100px}#rr-four .rr-hidden-controls{display:none!important}#rr-four .rr-track{cursor:default}#rr-four .rr-stage{padding-bottom:22px}#rr-four .rr-clock{font-variant-numeric:tabular-nums}#rr-four #rr-all.active{border-color:#e2b66c;box-shadow:0 0 18px #dbae4c33}
/* Visible playback and explicit motion preference, including Windows reduced motion. */
#rr-motion-toggle{border:1px solid #8c744a;background:#1d1914;color:#e4c68e;border-radius:20px;padding:9px 15px;font:inherit;font-size:12px;cursor:pointer;min-height:40px}#rr-motion-toggle:focus-visible{outline:2px solid #ebcb92;outline-offset:3px}#rr-four .rr-channel.on .rr-state{color:#f5d69f;font-weight:700;letter-spacing:1.1px}#rr-four.rr-motion-off .rr-channel.on button{animation:none!important}#rr-four.rr-motion-on .rr-channel.on .rr-controls button{animation:rr-live-glow 2.8s ease-in-out infinite!important}@keyframes rr-live-glow{0%,100%{box-shadow:0 0 12px rgba(227,185,114,.18)}50%{box-shadow:0 0 25px rgba(227,185,114,.55)}}
#rr-four .rr-upper{flex-wrap:wrap;gap:9px}#rr-four .rr-on-air{display:inline-block;padding:6px 9px;border:2px solid #42322c;border-radius:3px;background:linear-gradient(#21100d,#0b0807);color:#6e493e;box-shadow:inset 0 1px 4px #000;font:bold 10px 'Courier New',monospace;letter-spacing:2px;transition:color .3s,box-shadow .3s,background .3s}#rr-four .rr-channel.on .rr-on-air{color:#fff0d2;background:linear-gradient(#be4724,#8e2015);border-color:#eb9b6b;box-shadow:0 0 16px #ed633c66,inset 0 0 8px #ffb46777;text-shadow:0 0 5px #ffe1a7}
/* All Rock and direct channel navigation */
#rr-four .rr-channel[data-channel=all]{grid-column:1/-1;border-color:#c4cbd4;background:linear-gradient(135deg,#323942,#11151b 55%,#242b34);box-shadow:inset 0 1px 0 #ffffff65,0 10px 35px #0005}#rr-four .rr-channel[data-channel=all] .rr-name{color:#f2f5f9;letter-spacing:3px;font-size:28px}#rr-four .rr-channel[data-channel=all] .rr-art{max-width:670px;margin:auto}#rr-four .rr-channel[data-channel=all] .rr-controls button{background:linear-gradient(120deg,#fafcff,#afb8c5);color:#171c23;border-color:#e9eef5}#rr-four .rr-art canvas{position:relative;z-index:0}#rr-four .rr-symbol{z-index:2;opacity:1!important;mix-blend-mode:normal!important;filter:drop-shadow(0 2px 3px #000) drop-shadow(0 0 9px #ffffff35)!important;isolation:isolate}#rr-four .rr-channel{scroll-margin-top:100px}#rr-four .rr-channel:target{outline:2px solid #e4c180;outline-offset:5px;animation:rr-anchor-light 1.3s ease-out}@keyframes rr-anchor-light{from{box-shadow:0 0 36px #f6d39299}to{box-shadow:0 0 0 transparent}}
.rr-channel-nav{max-width:570px;margin:24px 0;color:#f6f1e8}.rr-channel-nav>div:first-child strong{display:block;font:600 16px Arial,sans-serif}.rr-channel-nav>div:first-child>span{display:block;font:12px Arial,sans-serif;color:#d2c8ba;margin:7px 0 12px}.rr-channel-links{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.rr-channel-links .rr-jump{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:9px 4px;border:1px solid #ffffff45;border-radius:10px;background:#101216ed;color:#eee;text-decoration:none;font:700 11px Arial,sans-serif;min-width:0;transition:transform .2s,border-color .2s}.rr-channel-links .rr-jump img{width:42px;height:42px;object-fit:contain}.rr-channel-links .rr-jump-all{background:linear-gradient(135deg,#e8edf3,#abb4bf);color:#141a22}.rr-channel-links .rr-jump-70{border-bottom:3px solid #dfb569}.rr-channel-links .rr-jump-80{border-bottom:3px solid #ed3954}.rr-channel-links .rr-jump-90{border-bottom:3px solid #c780ff}.rr-channel-links .rr-jump-2000{border-bottom:3px solid #65baff}.rr-channel-links a:hover{transform:translateY(-3px);border-color:#fff}.rr-channel-links a:focus-visible{outline:3px solid #f7cc83;outline-offset:3px}@media(max-width:600px){.rr-channel-links{grid-template-columns:repeat(4,minmax(0,1fr))}.rr-channel-links .rr-jump-all{grid-column:1/-1;flex-direction:row;gap:12px;font-size:14px;padding:5px}.rr-channel-nav{margin:18px 0}.rr-channel-links .rr-jump img{width:34px;height:34px}#rr-four .rr-channel[data-channel=all] .rr-name{font-size:24px}}@media(prefers-reduced-motion:reduce){#rr-four .rr-channel:target{animation:none}.rr-channel-links a{transition:none}}
