:root{--bg:#321257;--purple:#612b8a;--purple2:#71369b;--yellow:#eaff00;--white:#fff;--line:rgba(255,255,255,.75);font-family:'Space Grotesk',sans-serif;color:var(--white)}*{box-sizing:border-box}body{margin:0;background:#fbfaff;color:white}button,input,textarea,select{font:inherit}button{cursor:pointer;color:inherit}.enter{background:var(--yellow);color:#261630;border:0;border-radius:999px;padding:.9rem 1.6rem;font-weight:700;box-shadow:0 8px 25px #d7ef0033}.site{position:relative;min-height:100svh;background:#241a2d;display:grid;grid-template-columns:minmax(280px,24vw) minmax(0,1fr);overflow:hidden}.home-panel{background:linear-gradient(160deg,#542876,#24192e 70%);min-height:100svh;position:sticky;top:0;display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:2px solid var(--line);padding:3rem 2rem 6rem}.hero-logo{width:min(19vw,330px);aspect-ratio:1;padding:0;border:0;border-radius:50%;background:transparent;overflow:hidden;box-shadow:0 14px 45px #07040b70}.hero-logo img{width:100%;height:100%;object-fit:cover}.about-copy{margin-top:auto;text-align:center}.about-copy h2{font-size:clamp(1.6rem,2.3vw,2.5rem);font-weight:500;line-height:1.22;margin:2rem 0 .4rem}.about-copy p{color:#bfb2c9}.admin-link{border:0;background:transparent;color:#a99aae;font-size:.78rem;opacity:.7}.content-area{min-width:0;padding:2rem clamp(1.4rem,3vw,4rem) 7rem;position:relative;background:radial-gradient(ellipse at 60% 0,#402252aa,transparent 55%),#241a2d}.content-area:before{content:"";position:absolute;inset:0;background:url('../images/wakeup-logo.jpg') center 48%/min(62vw,660px) no-repeat;opacity:.035;pointer-events:none;filter:grayscale(1)}.section-head,.page{position:relative}.section-head{display:flex;align-items:flex-start;justify-content:space-between;min-height:92px;gap:1rem}.section-head h1{font-size:clamp(2rem,3vw,3.4rem);line-height:1.1;letter-spacing:-.045em;font-weight:500;margin:.2rem 0 1.5rem}.head-tools{display:flex;align-items:center;gap:.6rem}.search-open{font-size:1.8rem;width:42px;height:42px;border:0;background:transparent;color:var(--yellow)}.head-tools input{background:#ffffff13;border:1px solid #ffffff44;color:white;border-radius:25px;padding:.7rem 1rem;min-width:min(35vw,280px);outline:0}.head-tools input::placeholder{color:#c7bbc9}.page{min-height:68vh}.list-page:before,.lyrics-page:before{content:"";position:absolute;inset:0;background:url('../images/wakeup-logo.jpg') center/contain no-repeat;opacity:.045;z-index:-1;pointer-events:none}.track-list{display:grid;gap:.35rem;max-width:1180px}.track{display:grid;grid-template-columns:60px minmax(100px,1fr) 38px 38px;align-items:center;gap:.8rem;min-height:64px;padding:.3rem .25rem;border-radius:10px}.track:hover{background:#ffffff0c}.cover{width:60px;height:56px;border-radius:3px;object-fit:cover;background:#121014}.track-copy{min-width:0}.track-copy b,.track-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-copy b{font-size:1rem;font-weight:500}.track-copy small{color:var(--yellow);font-size:.94rem;line-height:1.15}.icon-action{border:0;background:transparent;color:var(--yellow);font-size:1.45rem;padding:.35rem}.icon-action.play{font-size:1.55rem}.empty{padding:2rem 1rem;color:#d1c8d6;text-align:center}.lyrics-list{display:grid;gap:1rem;max-width:950px}.lyric-card{border-radius:34px;background:rgba(105,45,145,.88);border:1px solid #ffffff0d;padding:1.2rem 1.6rem;display:grid;grid-template-columns:76px 1fr;gap:1rem;align-items:start;backdrop-filter:blur(10px)}.lyric-card img{width:76px;height:76px;border-radius:17px;object-fit:cover;background:#050505}.lyric-card h3{margin:.25rem 0 0;font-size:1.25rem;font-weight:500}.lyric-card .artist{color:var(--yellow);margin:.08rem 0 .6rem;font-weight:500}.lyric-card details summary{cursor:pointer;text-align:center;font-weight:600}.lyric-card pre{white-space:pre-wrap;font:inherit;color:#f4eff7;line-height:1.55}.home-intro{padding:3rem 0 2rem}.home-intro h2{font-size:clamp(2rem,4vw,4rem);margin:0;font-weight:500}.home-intro p{color:#d1c4dc}.media-fold{display:grid;gap:1.4rem;overflow:hidden}.marquee{display:flex;width:max-content;gap:1rem;animation:move 40s linear infinite}.marquee.reverse{animation-direction:reverse}.marquee:hover{animation-play-state:paused}.marquee img,.marquee video{width:clamp(180px,22vw,310px);height:clamp(115px,15vw,200px);object-fit:cover;border-radius:12px;background:#170f1d}.media-fold:empty{display:none}@keyframes move{to{transform:translateX(-50%)}}.bottom-nav{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:5;background:#2a2234eF;border:1px solid #ffffff0c;border-radius:60px;padding:.38rem .65rem;display:flex;gap:clamp(.3rem,2vw,1.4rem);box-shadow:0 10px 35px #09060c66;backdrop-filter:blur(16px)}.nav-item{background:transparent;border:0;min-width:58px;padding:.15rem .2rem;display:flex;flex-direction:column;align-items:center;gap:.05rem;border-radius:40px}.nav-item.active .nav-icon,.nav-item.active small{color:white}.nav-icon{font-size:2.7rem;line-height:1;color:white}.nav-icon.medley-icon{color:#ff69a7;text-shadow:-11px -4px #8276ff}.nav-item small{font-size:.76rem;color:#fff}.nav-logo{width:44px;height:44px;border-radius:50%;overflow:hidden;display:grid;place-items:center}.nav-logo img{width:100%;height:100%;object-fit:cover}.player{position:fixed;z-index:4;left:50%;bottom:100px;transform:translateX(-50%);width:min(680px,calc(100vw - 32px));border:1px solid #ffffff22;background:#19131eeF;border-radius:18px;padding:.7rem 1rem;display:flex;align-items:center;gap:.8rem;box-shadow:0 8px 32px #08060b80;backdrop-filter:blur(18px)}.player img{width:48px;height:48px;object-fit:cover;border-radius:9px;background:#09090b}.player-meta{flex:1;min-width:0}.player-meta b,.player-meta small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-meta small{color:var(--yellow)}.player-meta input{width:100%;height:12px;accent-color:var(--yellow)}#play-toggle{background:var(--yellow);color:#21182b;border:0;border-radius:50%;width:42px;height:42px;font-size:1.15rem}#volume{width:72px;accent-color:var(--yellow)}.mobile-head{display:none}.admin{position:fixed;inset:0;z-index:10;overflow:auto;background:#21182b;padding:1.2rem clamp(1rem,5vw,4rem) 4rem}.admin>header{max-width:1100px;margin:0 auto 2rem;display:flex;align-items:center;gap:1rem}.admin>header h1{flex:1}.admin button:not(.enter){background:#ffffff12;border:1px solid #ffffff33;border-radius:9px;padding:.65rem}.login-box{width:min(420px,100%);margin:10vh auto;text-align:center}.login-box>img{width:100px;border-radius:50%}.login-box form{display:grid;gap:1rem;text-align:left}.login-box label,.admin-content label{display:grid;gap:.45rem;color:#eee}.login-box input,.admin-content input:not([type=checkbox]),.admin-content select,.admin-content textarea{width:100%;border:1px solid #ffffff38;background:#ffffff0c;color:white;border-radius:9px;padding:.75rem}.admin-content input[type=file]{padding:.55rem}.admin-tabs{display:flex;gap:.5rem;max-width:1100px;margin:auto}.admin-content{display:grid;grid-template-columns:minmax(240px,390px) minmax(280px,1fr);gap:2rem;max-width:1100px;margin:1rem auto}.admin-content form{display:grid;align-content:start;gap:.8rem}.admin-content .check{display:flex;align-items:center}.admin-items{display:grid;gap:.6rem}.admin-row{display:flex;align-items:center;gap:.8rem;background:#ffffff0b;border:1px solid #ffffff1a;padding:.65rem;border-radius:10px}.admin-row img{width:46px;height:46px;object-fit:cover}.admin-row div{flex:1}.admin-row small{display:block;color:#cec0d8}.progress-wrap{display:grid;gap:.4rem}.progress-wrap progress{width:100%;accent-color:var(--yellow)}.toast{position:fixed;z-index:20;left:50%;bottom:20px;transform:translate(-50%,20px);opacity:0;background:#fff;color:#261630;padding:.8rem 1.1rem;border-radius:10px;transition:.2s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:760px){.site{display:block;padding-top:58px;padding-bottom:2rem;min-height:100svh}.mobile-head{height:56px;position:fixed;top:0;left:0;right:0;z-index:6;display:flex;align-items:center;justify-content:space-between;padding:0 1rem;background:#23182eeF;border-bottom:1px solid #ffffff16}.mobile-head h1{font-size:1.22rem;font-weight:500;flex:1;margin:0 .8rem;line-height:1.1}.logo-mini{width:38px;height:38px;padding:0;border:0;border-radius:50%;overflow:hidden;background:none}.logo-mini img{width:100%;height:100%;object-fit:cover}.home-panel{display:none}.content-area{padding:1.35rem 1rem 150px;min-height:calc(100svh - 58px)}.section-head{min-height:90px}.section-head h1{font-size:2rem;max-width:76%}.section-head .search-open{display:none}.head-tools input{position:absolute;top:46px;right:0;z-index:2;min-width:min(80vw,340px)}.track{grid-template-columns:58px minmax(80px,1fr) 32px 32px;gap:.55rem;min-height:63px}.track-copy b{font-size:.94rem}.track-copy small{font-size:.88rem}.cover{width:58px;height:55px}.lyric-card{grid-template-columns:58px 1fr;border-radius:26px;padding:.85rem;gap:.75rem}.lyric-card img{width:58px;height:58px;border-radius:15px}.lyric-card h3{font-size:1.06rem}.player{bottom:99px;padding:.55rem .65rem;gap:.6rem}.player img{width:42px;height:42px}#volume{display:none}.bottom-nav{bottom:12px;width:calc(100vw - 36px);justify-content:space-around;padding:.35rem .5rem;gap:0}.nav-item{min-width:62px}.nav-icon{font-size:2.35rem}.nav-logo{width:42px;height:42px}.home-intro{padding:2rem 0}.admin{padding:1rem}.admin>header{flex-wrap:wrap}.admin>header h1{font-size:1.3rem}.admin-content{grid-template-columns:1fr}.admin-tabs{overflow:auto}.admin-tabs button{white-space:nowrap}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;scroll-behavior:auto!important}}
