@layer base{:root{--cream:#f6f4ee;--charcoal:#2b2d2f;--slate-blue:#1b446d;--terracotta:#c56a3e;--ochre-gold:#d6a352;--border:#e8e4da;--muted:#e8e4da;--muted-foreground:#7d6b5a;--card-hover:#f0ece4;--sidebar:#1b446d;--player-bar:#fff;--accent:#c56a3e;--lyric-active:#1b446d;--lyric-inactive:#9ca3af}body{background-color:var(--cream);color:var(--charcoal);font-family:var(--font-cairo), sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden}:focus-visible{outline:2px solid var(--slate-blue);outline-offset:2px;border-radius:4px}button:not(:disabled){cursor:pointer}input:focus{outline:none}}@layer utilities{.text-gradient{background:linear-gradient(135deg, var(--slate-blue), var(--terracotta));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.scrollbar-none::-webkit-scrollbar{display:none}.scrollbar-none{-ms-overflow-style:none;scrollbar-width:none}.card-hover{transition:all .2s}.card-hover:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000001a}}.lyric-line{opacity:.3;cursor:pointer;padding:6px 0;transition:all .4s cubic-bezier(.4,0,.2,1);transform:scale(.92)}.lyric-line.active{opacity:1;color:var(--slate-blue);font-weight:700;transform:scale(1)}.lyric-line.near{opacity:.6;transform:scale(.96)}.progress-bar{cursor:pointer;position:relative}.progress-bar:hover .progress-filled{background:linear-gradient(90deg, var(--slate-blue), #28689e)}.progress-bar:hover .progress-thumb{opacity:1!important}.progress-filled{background:var(--slate-blue);border-radius:0 2px 2px 0;height:100%;transition:width .1s linear}.progress-thumb{background:var(--slate-blue);opacity:0;pointer-events:none;border-radius:50%;width:14px;height:14px;transition:opacity .15s;position:absolute;top:50%;transform:translateY(-50%);box-shadow:0 0 6px #1b446d66}.now-playing-panel{animation:.3s ease-out slideIn}@keyframes slideIn{0%{opacity:0;width:0}to{opacity:1}}.now-playing-enter{animation:.3s ease-out forwards fadeSlideUp}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg, var(--border) 25%, #f0ece4 50%, var(--border) 75%);background-size:200% 100%;border-radius:8px;animation:1.5s ease-in-out infinite shimmer}@keyframes shake{0%,to{transform:translate(0)}10%,50%,90%{transform:translate(-4px)}30%,70%{transform:translate(4px)}}.shake{animation:.4s ease-in-out shake}.player-gradient{background:linear-gradient(180deg, #1b446d1f 0%, var(--cream) 40%)}@media (max-width:767px){.desktop-only{display:none!important}}@media (min-width:768px){.mobile-only{display:none!important}}.sidebar-songs::-webkit-scrollbar{width:4px}.sidebar-songs::-webkit-scrollbar-track{background:0 0}.sidebar-songs::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:2px}input[type=range]{appearance:none;border-radius:2px;outline:none;height:4px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--slate-blue);cursor:pointer;border-radius:50%;width:14px;height:14px;box-shadow:0 0 4px #1b446d4d}