/* DEHIMA MUSIC — Player Clair */
.global-player{position:fixed;bottom:0;left:0;right:0;z-index:800;height:86px;background:rgba(254,250,244,0.97);backdrop-filter:blur(20px) saturate(1.3);border-top:1px solid var(--border);display:flex;align-items:center;padding:0 1.5rem;gap:1.2rem;box-shadow:0 -4px 24px rgba(44,31,20,0.1)}
.gp-left{display:flex;align-items:center;gap:12px;flex:0 0 260px;min-width:0}
.gp-thumb{width:52px;height:52px;border-radius:10px;overflow:hidden;flex-shrink:0;border:1px solid var(--border)}
.gp-thumb img{width:100%;height:100%;object-fit:cover}
.gp-info{flex:1;min-width:0}
.gp-title{font-size:14px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gp-artist{font-size:12px;color:var(--text-m);margin-top:2px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gp-artist:hover{color:var(--gold)}
.gp-like{background:none;border:none;font-size:18px;color:var(--text-s);transition:all 0.2s;flex-shrink:0}
.gp-like:hover,.gp-like.liked{color:var(--crimson);transform:scale(1.2)}
.gp-center{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px}
.gp-controls{display:flex;align-items:center;gap:6px}
.gpc-btn{background:none;border:none;color:var(--text-s);font-size:18px;padding:6px;border-radius:50%;transition:all 0.2s;display:flex;align-items:center;justify-content:center}
.gpc-btn:hover{color:var(--text);background:var(--cream2)}
.gpc-btn.active{color:var(--gold)}
.gpc-play{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--gold-l));color:white!important;font-size:17px}
.gpc-play:hover{transform:scale(1.08);box-shadow:0 0 16px rgba(184,134,11,0.4);background:linear-gradient(135deg,var(--gold),var(--gold-l))!important}
.gp-progress-wrap{display:flex;align-items:center;gap:9px;width:100%}
.gp-time{font-size:11px;color:var(--text-s);min-width:30px}
.gp-time:last-child{text-align:right}
.gp-progress-bar{flex:1;height:4px;border-radius:2px;background:var(--cream3);position:relative;cursor:pointer;transition:height 0.15s}
.gp-progress-bar:hover{height:6px}
.gp-progress-bar:hover .gp-progress-thumb{opacity:1}
.gp-progress-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--gold),var(--gold-l));transition:width 0.3s linear}
.gp-progress-thumb{position:absolute;top:50%;right:0;transform:translate(50%,-50%);width:12px;height:12px;border-radius:50%;background:var(--gold);opacity:0;transition:opacity 0.2s;pointer-events:none}
.gp-right{display:flex;align-items:center;gap:8px;flex:0 0 180px;justify-content:flex-end}
.gp-volume-wrap{display:flex;align-items:center;gap:7px}
.gp-volume{width:72px;height:4px;border-radius:2px;-webkit-appearance:none;background:var(--cream3);outline:none;cursor:pointer}
.gp-volume::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--gold);cursor:pointer}
.queue-panel{position:fixed;right:0;bottom:86px;z-index:790;width:320px;max-height:460px;background:var(--white);border:1px solid var(--border);border-radius:16px 16px 0 0;display:none;flex-direction:column;box-shadow:var(--shadow-l)}
.queue-panel.open{display:flex}
.queue-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.2rem;border-bottom:1px solid var(--border)}
.queue-header h3{font-family:'Cormorant Garamond',serif;font-size:14px;color:var(--gold);font-weight:700}
#closeQueue{background:none;border:none;color:var(--text-m);font-size:16px}
.queue-list{flex:1;overflow-y:auto;padding:0.5rem}
.queue-item{display:flex;align-items:center;gap:10px;padding:9px;border-radius:10px;cursor:pointer;transition:background 0.2s}
.queue-item:hover{background:var(--cream2)}
.queue-item.active{background:var(--gold-bg)}
.queue-thumb{width:38px;height:38px;border-radius:6px;object-fit:cover;border:1px solid var(--border)}
.queue-info{flex:1;min-width:0}
.queue-title{font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.queue-artist{font-size:11px;color:var(--text-m)}
.queue-remove{background:none;border:none;color:var(--text-s);font-size:16px;padding:2px 6px}
.queue-remove:hover{color:var(--crimson)}
@media (max-width:780px){.gp-left{flex:0 0 auto}.gp-right{display:none}}
@media (max-width:560px){.global-player{padding:0 1rem;gap:0.8rem}.gp-left{flex:0 0 110px}.gp-controls{gap:3px}}
