:root{--bg: #07090f;--surface: rgba(18, 24, 40, .72);--surface-deep: rgba(10, 14, 28, .85);--border: rgba(255,255,255,.07);--primary: #a78bfa;--primary-glow: #7c3aed;--accent: #f472b6;--cyan: #22d3ee;--green: #4ade80;--text: #f1f5f9;--muted: #64748b;--radius: 18px;--radius-sm: 10px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Outfit,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden}.bg-gradient{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at 15% 50%,rgba(124,58,237,.2) 0%,transparent 55%),radial-gradient(ellipse at 85% 20%,rgba(244,114,182,.14) 0%,transparent 55%),radial-gradient(ellipse at 50% 90%,rgba(34,211,238,.08) 0%,transparent 50%);pointer-events:none}.bg-orbs{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden}.orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.2;animation:float 14s ease-in-out infinite alternate}.orb-1{width:600px;height:600px;background:var(--primary-glow);top:-150px;left:-150px;animation-delay:0s}.orb-2{width:450px;height:450px;background:var(--accent);bottom:-100px;right:-100px;animation-delay:-5s}.orb-3{width:350px;height:350px;background:var(--cyan);bottom:25%;left:40%;animation-delay:-10s}@keyframes float{0%{transform:translate(0) scale(1)}to{transform:translate(25px,-25px) scale(1.06)}}#app{position:relative;min-height:100vh;display:flex;flex-direction:column;padding:1.25rem 1.5rem;gap:1rem;max-width:1400px;margin:0 auto}.panel{background:var(--surface);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.radio-header{display:flex;align-items:center;justify-content:space-between;background:var(--surface);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.5rem}.header-left,.header-right{display:flex;align-items:center;gap:1rem}.station-logo{width:52px;height:52px;background:linear-gradient(135deg,#7c3aed4d,#f472b633);border:1px solid rgba(167,139,250,.25);border-radius:14px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 20px #7c3aed40}.station-name{font-size:1.4rem;font-weight:800}.station-tagline{font-size:.8rem;color:var(--muted);margin-top:2px}.listener-badge{display:flex;align-items:center;gap:6px;background:#22d3ee14;border:1px solid rgba(34,211,238,.2);border-radius:999px;padding:.35rem .85rem;font-size:.82rem;color:var(--cyan);font-weight:600}.listener-label{color:#22d3eeb3;font-weight:400}.status-pill{display:flex;align-items:center;gap:8px;padding:.4rem 1rem;border-radius:999px;font-size:.8rem;font-weight:600;transition:all .4s}.status-pill.online{background:#f472b626;color:var(--accent);border:1px solid rgba(244,114,182,.35)}.status-pill.offline{background:#64748b1a;color:var(--muted);border:1px solid rgba(100,116,139,.2)}.pill-dot{width:8px;height:8px;border-radius:50%;background:currentColor}.status-pill.online .pill-dot{animation:pulse-dot 1.4s infinite}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.2}}.main-grid{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:1rem;flex:1;min-height:0}.panel-label{font-size:.65rem;font-weight:700;letter-spacing:2.5px;color:var(--muted);padding:1rem 1.25rem .5rem}.panel-left{display:flex;flex-direction:column;padding-bottom:1.25rem}.visualizer-wrapper{flex:1;position:relative;background:#0000004d;border-bottom:1px solid var(--border);overflow:hidden;min-height:160px}#visualizer{position:absolute;bottom:0;left:0;width:100%;height:100%}.vinyl-zone{display:flex;flex-direction:column;align-items:center;padding:1.25rem 0 .5rem;gap:.75rem}.vinyl{width:120px;height:120px;border-radius:50%;background:conic-gradient(from 0deg,#1a1a2e,#16213e,#0f2550,#16213e,#1a1a2e,#1f1f3a,#16213e 90%,#1a1a2e);box-shadow:0 0 30px #a78bfa40,0 0 60px #7c3aed1a;display:flex;align-items:center;justify-content:center;position:relative;transition:box-shadow .5s}.vinyl.playing{animation:spin 5s linear infinite;box-shadow:0 0 45px #a78bfa73,0 0 90px #f472b633}@keyframes spin{to{transform:rotate(360deg)}}.vinyl-rings{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;overflow:hidden}.ring{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.05);top:50%;left:50%;transform:translate(-50%,-50%)}.r1{width:92%;height:92%}.r2{width:70%;height:70%}.r3{width:48%;height:48%}.vinyl-center{width:28px;height:28px;background:var(--bg);border-radius:50%;border:2px solid rgba(167,139,250,.4);position:absolute;z-index:2}.vinyl-icon{position:absolute;z-index:3;display:flex;align-items:center;justify-content:center}.vinyl-status{font-size:.78rem;color:var(--muted);font-weight:500;letter-spacing:.5px}.panel-center{display:flex;flex-direction:column;justify-content:center;gap:1.25rem;padding:1.75rem 1.5rem}.now-playing-zone{text-align:center;min-height:100px}.now-label{font-size:.65rem;font-weight:700;letter-spacing:2.5px;color:var(--primary);margin-bottom:.85rem}.now-title{font-size:1.55rem;font-weight:800;color:#fff;margin-bottom:.35rem;line-height:1.2;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.now-artist{font-size:.95rem;font-weight:400;color:var(--muted)}.emission-zone{text-align:center;min-height:100px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem}.live-indicator{display:flex;align-items:center;gap:8px;color:var(--accent);font-size:.75rem;font-weight:800;letter-spacing:3px;background:#f472b61f;border:1px solid rgba(244,114,182,.3);padding:.35rem .9rem;border-radius:999px}.live-dot-anim{width:8px;height:8px;border-radius:50%;background:var(--accent);animation:pulse-dot 1s infinite}.emission-name{font-size:1.55rem;font-weight:800;color:#fff;line-height:1.2}.emission-sub{font-size:.85rem;color:var(--muted)}.controls-bar{display:flex;align-items:center;gap:1.25rem;background:#00000040;border:1px solid var(--border);border-radius:var(--radius-sm);padding:1rem 1.25rem}.play-btn{width:60px;height:60px;border-radius:50%;border:none;background:linear-gradient(135deg,var(--primary-glow),var(--primary));color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 0 24px #7c3aed8c;transition:transform .2s,box-shadow .2s;flex-shrink:0}.play-btn:hover{transform:scale(1.09);box-shadow:0 0 36px #7c3aedcc}.play-btn:active{transform:scale(.95)}.volume-group{display:flex;align-items:center;gap:.6rem;flex:1}.vol-icon{color:var(--muted);flex-shrink:0}input[type=range]{-webkit-appearance:none;flex:1;height:4px;background:#ffffff1a;border-radius:999px;outline:none;cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:var(--primary);border-radius:50%;box-shadow:0 0 8px #a78bfa99}.timer{font-size:.82rem;color:var(--muted);min-width:44px;text-align:right;font-weight:600}.panel-right{display:flex;flex-direction:column;height:100%}.chat-header{display:flex;align-items:center;gap:8px;padding:1rem 1.25rem;border-bottom:1px solid var(--border);font-size:.85rem;font-weight:700;color:var(--text);flex-shrink:0}.chat-online{margin-left:auto;font-size:.75rem;color:var(--green);font-weight:600}.chat-messages{flex:1;overflow-y:auto;padding:.75rem 1rem;display:flex;flex-direction:column;gap:.65rem;min-height:0;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.1) transparent}.chat-messages::-webkit-scrollbar{width:4px}.chat-messages::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:999px}.chat-msg{display:flex;gap:.6rem;align-items:flex-start}.chat-avatar{width:30px;height:30px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;color:#fff}.chat-msg-body{flex:1;min-width:0}.chat-msg-meta{display:flex;align-items:baseline;gap:.4rem;margin-bottom:.2rem}.chat-msg-name{font-size:.78rem;font-weight:700}.chat-msg-time{font-size:.68rem;color:var(--muted)}.chat-msg-text{font-size:.82rem;color:#f1f5f9d9;line-height:1.45;word-break:break-word}.chat-msg.own,.chat-msg.own .chat-msg-meta{flex-direction:row-reverse}.chat-msg.own .chat-msg-text{background:#7c3aed33;border:1px solid rgba(167,139,250,.25);border-radius:12px 2px 12px 12px;padding:.4rem .7rem;display:inline-block}.chat-input-zone{display:flex;gap:.5rem;padding:.75rem 1rem;border-top:1px solid var(--border);flex-shrink:0}#chatInput{flex:1;background:#ffffff0f;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);font-family:Outfit,sans-serif;font-size:.85rem;padding:.55rem .85rem;outline:none;transition:border .2s}#chatInput::placeholder{color:var(--muted)}#chatInput:focus{border-color:#a78bfa66}#chatSendBtn{width:38px;height:38px;border-radius:var(--radius-sm);border:none;cursor:pointer;background:linear-gradient(135deg,var(--primary-glow),var(--primary));color:#fff;display:flex;align-items:center;justify-content:center;transition:transform .18s,box-shadow .18s;flex-shrink:0}#chatSendBtn:hover{transform:scale(1.08);box-shadow:0 0 14px #7c3aed99}.programme-bar{background:var(--surface);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.5rem;display:flex;align-items:center;gap:1.5rem;overflow-x:auto;flex-shrink:0}.programme-title{display:flex;align-items:center;gap:.5rem;font-size:.8rem;font-weight:700;color:var(--muted);letter-spacing:1px;white-space:nowrap;flex-shrink:0}.programme-slots{display:flex;gap:.75rem;flex:1;min-width:0}.slot{display:flex;align-items:center;gap:.7rem;padding:.55rem 1rem;border-radius:var(--radius-sm);background:#ffffff0a;border:1px solid transparent;transition:.2s;white-space:nowrap;flex-shrink:0}.slot.current{background:#a78bfa1f;border-color:#a78bfa40}.slot-time{font-size:.78rem;font-weight:700;color:var(--primary)}.slot-name{font-size:.82rem;color:var(--text)}.slot.current .slot-name{color:#fff;font-weight:600}.slot-now{font-size:.65rem;background:var(--accent);color:#fff;padding:2px 7px;border-radius:999px;font-weight:700}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:999px}@media (max-width: 1024px){.main-grid{grid-template-columns:1fr 1fr}.panel-right{grid-column:1 / -1;min-height:350px}}@media (max-width: 768px){#app{padding:1rem .75rem}.radio-header{flex-direction:column;gap:1rem;align-items:flex-start}.header-right{width:100%;justify-content:space-between}.main-grid{grid-template-columns:1fr;display:flex;flex-direction:column}.panel-center{order:1}.panel-left{order:2;min-height:250px}.panel-right{order:3;min-height:400px}.now-title,.emission-name{font-size:1.35rem}.controls-bar{flex-wrap:wrap;justify-content:center}.volume-group{min-width:200px}}@media (max-width: 480px){.vinyl{width:90px;height:90px}.play-btn{width:52px;height:52px}.play-btn svg{width:24px;height:24px}.programme-slot{min-width:180px}}