.music-page{--bg:#05080a;--bg-2:#0a1210;--green:#00cc77;--bright:#00ff88;--dim:#3a9a68;--glow:rgba(0, 255, 136, 0.45);--line:rgba(0, 204, 119, 0.22);--mono:'Share Tech Mono', 'Courier New', monospace;--display:'Orbitron', 'Arial Black', sans-serif;margin:0;height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden;background:radial-gradient(ellipse at 50% -10%,rgba(0,60,40,.35) 0%,transparent 60%),var(--bg);color:var(--green);font-family:var(--mono);-webkit-font-smoothing:antialiased}.music-page *{box-sizing:border-box}.mp-topbar{flex:none;width:100%;max-width:760px;margin:0 auto;display:flex;align-items:center;gap:.6rem;padding:calc(.55rem + env(safe-area-inset-top)).9rem .55rem;border-bottom:1px solid var(--green)}.mp-home{display:inline-flex;align-items:center;gap:.15rem;color:var(--green);text-decoration:none;font-size:.82rem;letter-spacing:.03em;padding:.25rem .4rem;transition:color .15s ease}.mp-home:hover{color:var(--bright);text-shadow:0 0 8px var(--glow)}.mp-page-title{font-family:var(--display);font-weight:700;font-size:1rem;letter-spacing:.1em;text-transform:uppercase;color:var(--bright);text-shadow:0 0 10px var(--glow);display:inline-flex;align-items:center;gap:.4rem}.mp-count{margin-left:auto;font-size:.72rem;color:var(--dim);letter-spacing:.05em}.music-app{flex:auto;min-height:0;width:100%;max-width:760px;margin:0 auto;display:flex;flex-direction:column}.mp-main{flex:auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.mp-main::-webkit-scrollbar{width:8px}.mp-main::-webkit-scrollbar-thumb{background:rgba(0,204,119,.35);border-radius:4px}.mp-list{list-style:none;margin:0;padding:0}.mp-track{display:flex;align-items:center;gap:.75rem;padding:.6rem .9rem;border-bottom:1px solid var(--line);cursor:pointer;transition:background .15s ease;-webkit-tap-highlight-color:transparent}.mp-track:active{background:rgba(0,255,136,6%)}@media(hover:hover){.mp-track:hover{background:rgba(0,255,136,6%)}}.mp-track.playing{background:rgba(0,255,136,9%);box-shadow:inset 3px 0 0 var(--bright)}.mp-thumb{position:relative;flex:none;width:46px;height:46px;display:grid;place-items:center;border:1px solid var(--line);background-color:rgba(0,255,136,5%);background-size:cover;background-position:50%;color:var(--dim);font-size:1.1rem;overflow:hidden}.mp-thumb[style]>.bi-music-note{display:none}.mp-thumb-play,.mp-eq{position:absolute;inset:0;display:none;place-items:center}.mp-thumb-play{color:var(--bright);font-size:1.3rem;background:rgba(0,0,0,.4);text-shadow:0 0 8px var(--glow)}@media(hover:hover){.mp-track:hover .mp-thumb-play{display:grid}}.mp-track.playing .mp-thumb-play{display:none!important}.mp-eq{display:none;align-items:flex-end;justify-content:center;gap:2px;padding-bottom:9px;background:rgba(0,0,0,.4)}.mp-track.playing .mp-eq{display:flex}.mp-eq span{width:3px;height:40%;background:var(--bright);box-shadow:0 0 6px var(--glow);animation:mp-eq .9s ease-in-out infinite}.mp-eq span:nth-child(2){animation-delay:.3s}.mp-eq span:nth-child(3){animation-delay:.15s}@keyframes mp-eq{0%,100%{height:25%}50%{height:85%}}.music-app.paused .mp-track.playing .mp-eq span{animation-play-state:paused}.mp-track-info{flex:auto;min-width:0;display:flex;flex-direction:column}.mp-track-title{font-size:.92rem;color:var(--green);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mp-track.playing .mp-track-title{color:var(--bright);text-shadow:0 0 6px var(--glow)}.mp-track-sub{font-size:.73rem;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mp-track-dur{flex:none;font-size:.78rem;color:var(--dim);min-width:4ch;text-align:right}.mp-track-share{flex:none;display:grid;place-items:center;width:34px;height:34px;background:0 0;border:1px solid transparent;color:var(--dim);font-size:.9rem;cursor:pointer;transition:all .15s ease;-webkit-tap-highlight-color:transparent}.mp-track-share:hover,.mp-track-share:focus-visible{color:var(--bright);border-color:var(--bright);outline:none}.mp-player{flex:none;width:100%;max-width:760px;margin:0 auto;padding:.5rem .9rem calc(.6rem + env(safe-area-inset-bottom));border-top:1px solid var(--green);background:linear-gradient(180deg,rgba(0,20,14,.6),rgba(0,0,0,.4)),var(--bg-2);box-shadow:0 -6px 22px rgba(0,0,0,.55)}.mp-progress{display:flex;align-items:center;gap:.55rem;margin-bottom:.5rem}.mp-time{font-size:.72rem;color:var(--dim);min-width:3ch;text-align:center;flex:none}.mp-seek,.mp-vol{-webkit-appearance:none;appearance:none;height:6px;background:rgba(0,255,136,.14);border:1px solid var(--line);outline:none;cursor:pointer}.mp-seek{flex:auto;width:100%}.mp-vol{width:90px}.mp-seek::-webkit-slider-thumb,.mp-vol::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;background:var(--bright);box-shadow:0 0 8px var(--glow);cursor:pointer}.mp-seek::-moz-range-thumb,.mp-vol::-moz-range-thumb{width:14px;height:14px;border:none;background:var(--bright);box-shadow:0 0 8px var(--glow);cursor:pointer}.mp-bar{display:grid;grid-template-columns:1fr;gap:.5rem;align-items:center}.mp-nowplaying{display:flex;align-items:center;gap:.6rem;min-width:0}.mp-cover{flex:none;width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);background:rgba(0,255,136,6%);background-size:cover;background-position:50%;color:var(--dim);overflow:hidden}.mp-cover.has-art{color:transparent}.mp-meta{min-width:0;display:flex;flex-direction:column}.mp-title{font-family:var(--display);font-size:.9rem;font-weight:700;color:var(--bright);text-shadow:0 0 8px var(--glow);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mp-artist{font-size:.76rem;color:var(--green);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mp-controls{display:flex;align-items:center;justify-content:center;gap:.5rem}.mp-btn{display:grid;place-items:center;width:44px;height:44px;padding:0;background:0 0;border:1px solid var(--line);color:var(--green);font-size:1.15rem;cursor:pointer;transition:all .15s ease;-webkit-tap-highlight-color:transparent}.mp-btn:hover,.mp-btn:focus-visible{color:var(--bright);border-color:var(--bright);box-shadow:0 0 8px rgba(0,255,136,.35);outline:none}.mp-btn.active{color:var(--bright);border-color:var(--bright);background:rgba(0,255,136,.1)}.mp-btn-sm{width:38px;height:38px;font-size:.95rem}.mp-btn-play{width:54px;height:54px;font-size:1.6rem;color:var(--bright);border-color:var(--bright);box-shadow:0 0 12px rgba(0,255,136,.3)}.mp-extras{display:none;align-items:center;gap:.5rem;justify-content:flex-end}.mp-share-current:disabled{opacity:.35;cursor:default;box-shadow:none}@media(min-width:640px){.mp-bar{grid-template-columns:minmax(0,1fr)auto auto;gap:.75rem 1.25rem}.mp-extras{display:flex}.mp-cover{width:46px;height:46px}}.mp-toast{position:fixed;left:50%;bottom:calc(6.5rem + env(safe-area-inset-bottom));transform:translate(-50%,1rem);z-index:60;padding:.55rem 1rem;background:rgba(0,15,10,.96);border:1px solid var(--bright);color:var(--bright);font-size:.8rem;letter-spacing:.03em;box-shadow:0 0 14px rgba(0,255,136,.3);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;max-width:90vw;text-align:center}.mp-toast.show{opacity:1;transform:translate(-50%,0)}.mp-empty{margin:2.5rem auto;max-width:420px;padding:2rem 1.5rem;text-align:center;border:1px dashed rgba(0,204,119,.35);color:var(--dim)}.mp-empty i{font-size:2.5rem}.mp-empty p{margin:.75rem 0 0;letter-spacing:.08em}.mp-empty .mp-empty-hint{font-size:.8rem}.mp-empty code{color:var(--bright);background:rgba(0,255,136,.1);padding:.1rem .35rem;border:1px solid rgba(0,204,119,.3)}@media(prefers-reduced-motion:reduce){.mp-eq span{animation:none;height:55%}}