:root{--fpm-accent:var(--accent,#c2fd02);--fpm-green:#c2fd02;--fpm-amber:#31d0f9;--fpm-glass:#0a0a0efa;--fpm-surface:#f5e6cc0a;--fpm-border:#f5e6cc12;--fpm-text:#fff8ed;--fpm-muted:#f5e6cc6b;--fpm-dur:.42s}.fpm-backdrop{z-index:800;-webkit-backdrop-filter:blur(20px)saturate(150%);opacity:0;pointer-events:none;transition:opacity var(--fpm-dur) ease;background:#000000c7;position:fixed;inset:0}.fpm-backdrop.fpm-open{opacity:1;pointer-events:all}.fpm-modal{z-index:810;pointer-events:none;background:var(--fpm-glass);border:1px solid var(--fpm-border);opacity:0;width:calc(100% - 28px);max-width:460px;height:fit-content;transition:transform var(--fpm-dur) cubic-bezier(.22,1,.36,1), opacity calc(var(--fpm-dur)*.7) ease;border-radius:24px;margin:auto;font-family:Montserrat,sans-serif;position:fixed;inset:68px 0 88px;overflow:hidden;transform:translateY(20px);box-shadow:0 32px 80px #000000bf,0 0 0 1px #ffffff0d,inset 0 1px #ffffff12}.fpm-modal:after{content:"";z-index:1;background:linear-gradient(90deg,#0000 5%,#c2fd0273 40%,#31d0f947 60%,#0000 95%);height:1px;position:absolute;top:0;left:0;right:0}.fpm-modal.fpm-open{opacity:1;pointer-events:all;transform:translateY(0)}@media (width>=640px){.fpm-modal{border:1px solid var(--fpm-border);border-radius:24px;width:min(840px,90vw);max-width:none;height:auto;margin:0;inset:50% auto auto 50%;transform:translate(-50%,-42%)scale(.93);box-shadow:0 48px 96px #000000bf,0 0 0 1px #ffffff0a,inset 0 1px #ffffff0f}.fpm-modal.fpm-open{transform:translate(-50%,-50%)scale(1)}}.fpm-handle{cursor:grab;touch-action:none;flex-shrink:0;justify-content:center;padding:12px 0 4px;display:flex}.fpm-handle span{background:#ffffff26;border-radius:3px;width:36px;height:3px}@media (width>=640px){.fpm-handle{display:none}}.fpm-close{color:#f5e6cc80;cursor:pointer;z-index:10;background:#f5e6cc0a;border:1px solid #f5e6cc14;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;transition:background .2s,color .2s,border-color .2s;display:flex;position:absolute;top:16px;right:18px}.fpm-close:hover{color:var(--fpm-text);background:#f5e6cc14;border-color:#f5e6cc24}.fpm-inner{flex-direction:column;gap:20px;padding:22px 24px 28px;display:flex}@media (width>=640px){.fpm-inner{flex-direction:row;align-items:flex-start;gap:32px;padding:28px 32px 32px}}.fpm-artwork-col{flex-shrink:0}@media (width>=640px){.fpm-artwork-col{width:272px}}.fpm-artwork-wrap{aspect-ratio:1;background:#111;border-radius:16px;width:100%;max-width:220px;margin:0 auto;position:relative;overflow:hidden;box-shadow:0 24px 56px #000000a6,0 0 0 1px #ffffff0d}@media (width>=640px){.fpm-artwork-wrap{max-width:100%}}.fpm-artwork-wrap img{object-fit:cover;width:100%;height:100%;transition:transform .6s;display:block}.fpm-artwork-wrap:hover img{transform:scale(1.04)}.fpm-onair{backdrop-filter:blur(10px);letter-spacing:1.5px;color:#fff;text-transform:uppercase;background:#0009;border:1px solid #ffffff1f;border-radius:50px;align-items:center;gap:6px;padding:4px 11px 4px 8px;font-size:9px;font-weight:700;display:flex;position:absolute;top:10px;right:10px}.fpm-onair-dot{background:var(--fpm-accent);border-radius:50%;flex-shrink:0;width:7px;height:7px;position:relative}.fpm-onair-dot:before,.fpm-onair-dot:after{content:"";background:var(--fpm-accent);opacity:0;border-radius:50%;animation:2s ease-out infinite fpmLivePulse;position:absolute;inset:0}.fpm-onair-dot:after{animation-delay:1s}@keyframes fpmLivePulse{0%{opacity:0}40%{opacity:.5}to{opacity:0;transform:scale(2.3)}}.fpm-info-col{flex-direction:column;flex:1;gap:18px;min-width:0;display:flex}.fpm-meta-block{background:#ffffff08;border:1px solid #ffffff0d;border-radius:14px;padding:12px 14px 14px;position:relative;overflow:hidden}#fpmVisualizer{pointer-events:none;z-index:0;opacity:.55;width:100%;height:100%;position:absolute;bottom:0;left:0;-webkit-mask-image:linear-gradient(#0000 0%,#0009 45%,#000 100%);mask-image:linear-gradient(#0000 0%,#0009 45%,#000 100%)}.fpm-meta-block .fpm-station-tag,.fpm-meta-block .fpm-song,.fpm-meta-block .fpm-artist{z-index:1;position:relative}.fpm-station-tag{letter-spacing:2px;text-transform:uppercase;color:var(--fpm-green);background:#c2fd0214;border:1px solid #c2fd022e;border-radius:50px;align-items:center;gap:5px;width:fit-content;padding:3px 10px 3px 7px;font-size:9px;font-weight:700;display:inline-flex}.fpm-song{text-transform:uppercase;color:var(--fpm-text);letter-spacing:-.3px;white-space:nowrap;text-overflow:ellipsis;margin:4px 0 0;font-size:clamp(18px,4.5vw,25px);font-weight:900;line-height:1.1;overflow:hidden}.fpm-artist{color:#ffffff7a;white-space:nowrap;text-overflow:ellipsis;margin:4px 0 0;font-size:12px;font-weight:500;overflow:hidden}.fpm-play-btn{color:#000;letter-spacing:2.5px;text-transform:uppercase;cursor:pointer;background:#fff;border:none;border-radius:14px;justify-content:center;align-items:center;gap:10px;width:100%;padding:15px;font-family:Montserrat,sans-serif;font-size:13px;font-weight:800;transition:background .2s,transform .15s,box-shadow .2s;display:flex;box-shadow:0 8px 24px #0000004d}.fpm-play-btn:hover{background:#f2f2f2;transform:translateY(-1px);box-shadow:0 14px 32px #0006}.fpm-play-btn:active{transform:scale(.97)}.fpm-play-btn.is-playing{background:var(--fpm-green)}.fpm-play-btn svg{flex-shrink:0;width:16px;height:16px}.fpm-vol-row{align-items:center;gap:10px;display:flex}.fpm-vol-icon{color:#ffffff47;flex-shrink:0;align-items:center;display:flex}.fpm-vol-track{cursor:pointer;background:#ffffff1a;border-radius:50px;flex:1;height:3px;position:relative}.fpm-vol-fill{background:linear-gradient(90deg, var(--fpm-accent), var(--fpm-green));pointer-events:none;border-radius:50px;height:100%;transition:width 50ms;position:absolute;top:0;left:0}.fpm-vol-thumb{cursor:grab;background:#fff;border-radius:50%;width:13px;height:13px;transition:transform .1s;position:absolute;top:50%;transform:translate(-50%,-50%);box-shadow:0 2px 8px #0006}.fpm-vol-thumb:hover{transform:translate(-50%,-50%)scale(1.35)}.fpm-vol-label{color:var(--fpm-muted);text-align:right;min-width:24px;font-size:10px;font-weight:600}.fpm-history-btn{border:1px solid var(--fpm-border);background:var(--fpm-surface);color:#ffffff80;letter-spacing:1.8px;text-transform:uppercase;cursor:pointer;border-radius:12px;align-items:center;gap:10px;width:100%;padding:12px 16px;font-family:Montserrat,sans-serif;font-size:10px;font-weight:700;transition:background .22s,border-color .22s,color .22s;display:flex;position:relative;overflow:hidden}.fpm-history-btn:before{content:"";pointer-events:none;background:linear-gradient(90deg,#0000,#c2fd020d,#0000);transition:transform .55s;position:absolute;inset:0;transform:translate(-100%)}.fpm-history-btn:hover:before{transform:translate(100%)}.fpm-history-btn:hover{color:#ffffffc7;background:#c2fd020d;border-color:#c2fd0238}.fpm-history-btn .fpm-hbtn-label{text-align:left;flex:1}.fpm-history-btn .fpm-hbtn-count{width:18px;height:18px;color:var(--fpm-green);background:#c2fd021f;border:1px solid #c2fd0238;border-radius:50%;justify-content:center;align-items:center;font-size:9px;font-weight:800;display:inline-flex}.fpm-history-btn .fpm-hbtn-arrow{color:#ffffff2e;flex-shrink:0;transition:transform .3s,color .2s}.fpm-history-btn:hover .fpm-hbtn-arrow{color:var(--fpm-green);transform:translate(3px)}.fph-backdrop{z-index:900;-webkit-backdrop-filter:blur(8px);opacity:0;pointer-events:none;background:#0000008c;transition:opacity .35s;position:fixed;inset:0}.fph-backdrop.fph-open{opacity:1;pointer-events:all}.fph-modal{z-index:910;pointer-events:none;opacity:0;background:#080810fc;border:1px solid #ffffff17;border-bottom:none;border-top-left-radius:32px;border-top-right-radius:32px;width:100%;font-family:Montserrat,sans-serif;transition:transform .44s cubic-bezier(.22,1,.36,1),opacity .3s;position:fixed;inset:auto 0 0;overflow:hidden;transform:translateY(100%);box-shadow:0 -20px 60px #0009}.fph-modal:before{content:"";z-index:1;background:linear-gradient(90deg,#0000 8%,#c2fd0280 35%,#31d0f952 65%,#0000 92%);height:1px;position:absolute;top:0;left:0;right:0}.fph-modal.fph-open{opacity:1;pointer-events:all;transform:translateY(0)}@media (width>=640px){.fph-modal{border:1px solid #ffffff1a;border-radius:24px;flex-direction:column;width:min(480px,88vw);max-height:78vh;display:flex;inset:50% auto auto 50%;transform:translate(-50%,-42%)scale(.92);box-shadow:0 40px 80px #000c,0 0 0 1px #ffffff0a,inset 0 1px #ffffff12}.fph-modal.fph-open{transform:translate(-50%,-50%)scale(1)}}.fph-handle{cursor:grab;touch-action:none;flex-shrink:0;justify-content:center;padding:13px 0 6px;display:flex}.fph-handle span{background:#ffffff21;border-radius:3px;width:36px;height:3px}@media (width>=640px){.fph-handle{display:none}}.fph-header{border-bottom:1px solid #ffffff0f;flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 22px 14px;display:flex}.fph-title-group{align-items:center;gap:10px;display:flex}.fph-icon{width:32px;height:32px;color:var(--fpm-green);background:#c2fd021a;border:1px solid #c2fd0233;border-radius:9px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.fph-title{letter-spacing:.5px;text-transform:uppercase;color:#fff;font-size:14px;font-weight:800}.fph-subtitle{color:#ffffff59;letter-spacing:.5px;margin-top:1px;font-size:10px;font-weight:500}.fph-close{color:#ffffff73;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;transition:background .2s,color .2s,border-color .2s;display:flex}.fph-close:hover{color:#fff;background:#ffffff1f;border-color:#ffffff2e}.fph-body{scrollbar-width:thin;scrollbar-color:#c2fd0233 transparent;flex:1;padding:14px 16px 24px;overflow:hidden auto}.fph-body::-webkit-scrollbar{width:3px}.fph-body::-webkit-scrollbar-thumb{background:#c2fd0233;border-radius:3px}.fph-empty{color:#fff3;letter-spacing:1px;text-transform:uppercase;text-align:center;flex-direction:column;align-items:center;gap:12px;padding:40px 0;font-size:12px;font-weight:600;display:flex}.fph-empty svg{opacity:.2}.fph-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.fph-track{cursor:default;opacity:0;background:#ffffff08;border:1px solid #ffffff0f;border-radius:14px;align-items:center;gap:14px;padding:12px 14px;transition:background .2s,border-color .2s,transform .2s;display:flex;position:relative;transform:translateY(10px)}.fph-modal.fph-open .fph-track{animation:.4s forwards fphTrackIn}.fph-modal.fph-open .fph-track:first-child{animation-delay:70ms}.fph-modal.fph-open .fph-track:nth-child(2){animation-delay:.14s}.fph-modal.fph-open .fph-track:nth-child(3){animation-delay:.21s}.fph-modal.fph-open .fph-track:nth-child(4){animation-delay:.28s}@keyframes fphTrackIn{to{opacity:1;transform:translateY(0)}}.fph-track:hover{background:#c2fd020d;border-color:#c2fd0226;transform:translate(-2px)}.fph-num{color:#c2fd024d;text-align:center;flex-shrink:0;min-width:16px;font-size:11px;font-style:italic;font-weight:800}.fph-art{background:#ffffff0f;border-radius:10px;flex-shrink:0;width:52px;height:52px;position:relative;overflow:hidden;box-shadow:0 4px 16px #0006,0 0 0 1px #ffffff0d}.fph-art img{object-fit:cover;width:100%;height:100%;transition:transform .4s;display:block}.fph-track:hover .fph-art img{transform:scale(1.08)}.fph-art:after{content:"";pointer-events:none;background:linear-gradient(135deg,#ffffff0f 0%,#0000 60%);position:absolute;inset:0}.fph-meta{flex-direction:column;flex:1;gap:3px;min-width:0;display:flex}.fph-track-song{color:#ffffffe6;white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:700;overflow:hidden}.fph-track-artist{color:#ffffff61;white-space:nowrap;text-overflow:ellipsis;font-size:11px;font-weight:500;overflow:hidden}.fph-wave{opacity:.15;flex-shrink:0;align-items:flex-end;gap:2px;height:16px;display:flex}.fph-wave span{background:var(--fpm-green);border-radius:2px;width:2px;display:block}.fph-wave span:first-child{height:50%}.fph-wave span:nth-child(2){height:100%}.fph-wave span:nth-child(3){height:65%}.fph-wave span:nth-child(4){height:38%}.fph-time{color:#ffffff2e;letter-spacing:.5px;text-align:right;flex-direction:column;flex-shrink:0;align-items:flex-end;gap:4px;font-size:9px;font-weight:600;display:flex}.fph-footer{text-align:center;border-top:1px solid #ffffff0d;flex-shrink:0;padding:12px 16px 16px}.fph-footer-text{letter-spacing:1.5px;text-transform:uppercase;color:#ffffff26;font-size:9px;font-weight:600}body.fpm-modal-open{overflow:hidden}#app-player .player-left .player-artwork-style{cursor:pointer;transition:transform .2s,box-shadow .2s}#app-player .player-left .player-artwork-style:hover{transform:scale(1.08);box-shadow:0 0 0 4px #c2fd0247}
