*{box-sizing:border-box}
body{margin:0;color:white;font-family:Arial,Verdana,sans-serif;background:radial-gradient(ellipse at 48% 90%,#0755b6 0,#05336f 32%,#041b3e 70%,#020b1c 100%);min-height:100vh}
.site{max-width:1320px;margin:auto;padding:14px 18px 26px}
.banner img{display:block;width:100%;height:auto;max-height:275px;object-fit:contain;border-radius:9px;border:1px solid #72a9d8}
.system-datetime{display:flex;align-items:center;justify-content:center;gap:50px;margin-top:8px;padding:5px 10px;color:#fff;font-family:Verdana,sans-serif;font-size:13px;font-weight:400}
.system-datetime #system-time{font-variant-numeric:tabular-nums;white-space:nowrap}
.hero{display:grid;grid-template-columns:46% 54%;gap:9px;margin:10px 0 8px;padding-right:9px;align-items:stretch}
.schedule,.player{height:100px;min-width:0;overflow:hidden;border:1px solid #2088dc;border-radius:10px;background:#031226}
.player{position:relative;background:#07070a}
.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:4px 5px}
.tabs button{font-weight:700;color:#fff;border:1px solid #29425b;border-radius:6px;background:#0a1c35;padding:3px 1px;cursor:pointer;font-size:11px;line-height:17px}
.tabs button.active{background:linear-gradient(#f20025,#a50019);border-color:#f44353}
.shows{height:70px;overflow:auto;scrollbar-width:thin;scrollbar-color:#bc0d28 #061528}
.show{display:grid;grid-template-columns:65px 1fr;align-items:center;min-height:23px;border-bottom:1px solid #25394e;font-size:12px;line-height:1.15}
.show .time{color:#fff;font-weight:700;text-align:center}
.show .name{font-weight:700;padding:0 5px}
.show.active{background:#10263d;color:#fff;border-left:4px solid #24618c}
.player-art{position:absolute;inset:0;background-image:url("assets/lp.webp");background-position:center center;background-size:cover;background-repeat:no-repeat;background-color:#07070a}
.player:after{content:'';position:absolute;inset:58% 0 0;pointer-events:none;background:linear-gradient(transparent,rgba(0,0,0,.55))}
.controls{position:absolute;z-index:2;bottom:18px;left:3%;display:flex;align-items:center;gap:6px;width:58%;color:#fff;text-shadow:0 1px 2px #000}
.controls button{width:26px;height:26px;flex:none;border:0;border-radius:50%;color:#fff;font-size:16px;background:linear-gradient(#fb1736,#b60020);cursor:pointer}
.controls input{min-width:22px;height:12px;width:100%;accent-color:#ed092c}
.controls #volume-text{font-size:10px}
.now{position:absolute;z-index:2;bottom:0;left:0;width:100%;min-height:17px;display:flex;align-items:center;justify-content:center;gap:8px;padding:1px 5px;background:#0008;font-size:10px}
.now span{border-left:1px solid #aaa;padding-left:8px}
footer{margin-top:12px;min-height:62px;border:1px solid #1c99f3;border-radius:10px;background:linear-gradient(#06366e,#010711);display:flex;justify-content:space-around;align-items:center;flex-wrap:wrap;gap:12px;padding:12px 10px;font-size:12px}
footer a{color:#fff;text-decoration:none}
footer b{display:inline-grid;place-items:center;border-radius:50%;width:23px;height:23px;font-size:17px;margin-right:5px}
.phone,.email{background:#db0929}
.whats{background:#00b850}

.player .now{display:none}
.player .controls input[type="range"]{appearance:none;-webkit-appearance:none;background:linear-gradient(to right,#fff 0%,#fff var(--vol-pct,100%),#858585 var(--vol-pct,100%),#858585 100%);height:4px;border-radius:4px;cursor:pointer;accent-color:#fff;width:75%;flex:0 1 75%}
.player .controls input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;border:1px solid #aaa}
.player .controls input[type="range"]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#fff;border:1px solid #aaa}
.player .controls input[type="range"]::-moz-range-progress{background:#fff;height:4px;border-radius:4px}
.player .controls input[type="range"]::-moz-range-track{background:transparent;height:4px}

.controls #play{background-image:url("assets/play_approved.png");background-size:contain;background-position:center;background-repeat:no-repeat;background-color:transparent;font-size:0;color:transparent}
.controls #play.is-playing{background-image:url("assets/stop_approved.png")}
.player .controls #play{width:52px;height:52px}
.player .controls #play:focus{outline:none}
.player .controls #play:focus-visible{outline:2px solid #fff;outline-offset:2px;border-radius:50%}
.player .controls #play{-webkit-tap-highlight-color:transparent}

.player .controls #volume-text{display:none}
.player .controls input#volume{writing-mode:vertical-lr;direction:rtl;-webkit-appearance:none;appearance:none;width:4px;min-width:4px;max-width:4px;height:70px;min-height:70px;max-height:70px;flex:0 0 4px;position:relative;bottom:0;background:linear-gradient(to top,#fff 0%,#fff var(--vol-pct,100%),#858585 var(--vol-pct,100%),#858585 100%)}
.player .controls{top:50%;bottom:auto;transform:translateY(-50%);gap:26px}

.player-logo{position:absolute;z-index:2;right:12px;top:50%;transform:translateY(-50%);width:clamp(90px,22%,155px);height:80px;object-fit:contain;mix-blend-mode:screen;pointer-events:none}
.player .player-logo{mix-blend-mode:normal;object-fit:contain;filter:drop-shadow(1px 2px 2px #000) drop-shadow(0 0 5px rgba(0,0,0,.95));}

:root{--tira-fondo:#04152e;--tira-borde:#188ee7;--tira-titulo:#f5c542;--tira-texto:#fff;--tira-texto-sec:#9fb3c8;--tira-azul:#1f7ee8;--tira-verde:#1faa4a;--tira-manual:#3a4658}
.tiras{display:grid;gap:10px;margin-top:12px}
.tira{display:grid;grid-template-columns:minmax(0,230px) minmax(0,1fr) 150px;gap:14px;align-items:center;padding:8px;border:1px solid var(--tira-borde);border-radius:10px;background:var(--tira-fondo);color:var(--tira-texto)}
.tira-thumb{width:100%;height:100px;overflow:hidden;border-radius:8px}
.tira-img{display:block;height:100%;width:auto;max-width:none}
.tira-texto{min-width:0;height:100px;overflow:hidden;line-height:1.4}
.tira-titulo{margin:0 0 4px;font-size:16px;font-weight:700;color:var(--tira-titulo)}
.tira-desc{margin:0;font-size:12px;color:var(--tira-texto-sec);display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.tira-botones{display:grid;grid-template-columns:1fr;gap:4px}
.btn-tira{display:flex;justify-content:center;align-items:center;min-height:30px;padding:4px;border-radius:8px;color:#fff;text-decoration:none;text-align:center;font-size:12px;line-height:1.2}
.btn-tira strong{font-size:12px}
.btn-demo{background:var(--tira-azul)}
.btn-comprar{background:var(--tira-verde)}
.btn-manual{background:var(--tira-manual)}

@media(max-width:650px){
.site{padding:8px}
.hero{grid-template-columns:1fr;gap:7px;padding:0}
.player{grid-row:1}
.controls{width:64%}
footer{gap:10px;font-size:12px}
.system-datetime{font-size:11px;padding:5px 3px;gap:50px}
.tira{grid-template-columns:86px minmax(0,1fr) 66px;gap:8px;padding:6px}
.tira-thumb{height:70px}
.tira-texto{height:70px}
.tira-titulo{font-size:13px;margin:0 0 2px}
.tira-desc{font-size:11px;line-height:1.3;-webkit-line-clamp:3}
.btn-tira{min-height:20px;font-size:11px}
.btn-tira strong{font-size:11px}
}