@import"https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap";:root{font-family:Manrope,Arial,sans-serif;color:#192d2a;background:#f5f5ef;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;border:1px solid #dce3da;border-radius:9px;padding:10px 15px;background:transparent;color:inherit}button:hover{background:#e3ebdf}button:disabled{opacity:.45;cursor:default}input,select{padding:12px;border:1px solid #d3dcd1;background:#fff;border-radius:8px;color:inherit}label{display:grid;gap:10px;margin:22px 0}h1{font-size:48px;line-height:1.12;letter-spacing:-2px;margin:22px 0}h2{font-size:24px}em{font-style:normal;color:#799643}small{display:block;color:#73817a;font-size:12px;margin-top:5px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:800}.badge{font-size:11px;background:#e6eddb;padding:9px 14px;border-radius:30px;font-weight:700}.primary{background:#254b3b;color:#fff;border:0;padding:14px 24px}.primary:hover{background:#35654c}aside{position:fixed;width:220px;inset:0 auto 0 0;padding:36px 23px;background:#e9ede3;border-right:1px solid #dce3d5}aside>button{display:block;width:100%;text-align:left;border:0;margin:10px 0}.selected{background:#d5e0c8;font-weight:700}.logo{font-size:42px;font-weight:800;letter-spacing:-3px;margin-bottom:60px}.logo span{display:block;font-size:10px;letter-spacing:3px;text-transform:uppercase}.aside-bottom{position:absolute;bottom:35px;font-size:18px}.aside-bottom button{display:block;margin-top:20px}main{margin-left:220px;padding:35px 45px 125px;max-width:1600px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:35px}.hero{background:#e9eddf;border-radius:20px;padding:35px 40px;display:flex;justify-content:space-between;overflow:hidden}.hero p,.muted{color:#758076;font-size:14px;line-height:1.7}.record{width:245px;height:245px;flex-shrink:0;border-radius:50%;background:repeating-radial-gradient(#29392f 0px 3px,#38473b 4px,#29392f 5px);display:grid;place-items:center;transform:rotate(-17deg);margin:12px 10px}.record div{width:100px;height:100px;border-radius:50%;background:#b7ca92;text-align:center;padding-top:24px;font-size:24px;font-weight:800}.record small{color:#344736;font-size:9px}.stats{display:flex;gap:30px;margin:26px 0 40px;color:#6c786d;font-size:13px}.stats b{font-size:23px;color:#284735;margin-right:6px}.toolbar{display:flex;align-items:center;gap:15px;margin-bottom:18px}.toolbar h2{margin-right:auto}.toolbar input{width:260px}.table{border-top:1px solid #dce1d7}.row{display:grid;grid-template-columns:minmax(230px,2fr) 90px 180px minmax(120px,1fr);gap:18px;align-items:center;padding:17px 0;border-bottom:1px solid #e0e4db}.heading{font-size:10px;letter-spacing:1px;color:#819080}.song{display:flex;gap:15px;align-items:center}.song strong{font-size:13px}.art{width:52px;height:52px;padding:0;border:0;border-radius:8px;overflow:hidden;position:relative;background:#dfe7d2;flex-shrink:0}.art img{width:100%;height:100%;object-fit:cover}.art i{position:absolute;inset:0;display:none;place-items:center;background:#0005;color:#fff}.art:hover i{display:grid}.count{width:65px;border:0;background:#e7eddf}.date{font-size:12px;color:#778477}.error{color:#ac4536;font-size:12px;overflow-wrap:anywhere}.empty{padding:40px;text-align:center;color:#74816d}.settings{max-width:740px;background:#fff;border:1px solid #e0e4da;border-radius:15px;padding:28px;margin-top:35px}.check{display:flex;align-items:center}.check input{width:18px;height:18px}hr{border:0;border-top:1px solid #e4e8e0;margin:30px 0}footer{position:fixed;bottom:0;left:220px;right:0;background:#fffef8;border-top:1px solid #d8dfd2;padding:18px 35px;display:flex;align-items:center;gap:25px}footer audio{flex:1}footer strong{font-size:13px}.login{min-height:100vh;display:grid;grid-template-columns:1fr 440px;align-items:center;gap:80px;max-width:1150px;margin:auto;padding:50px}.login h1{font-size:66px}.login form{background:#fff;padding:35px;border-radius:20px;box-shadow:0 20px 80px #2445290a}.modal{position:fixed;inset:0;background:#142b2377;display:grid;place-items:center}.modal section{background:#fff;border-radius:18px;padding:30px;max-height:80vh;overflow:auto;min-width:320px}@media(max-width:1000px){aside{width:170px}main{margin-left:170px;padding:25px}footer{left:170px}.record{display:none}.row{grid-template-columns:2fr 60px 1fr}.row>:nth-child(3){display:none}.toolbar{flex-wrap:wrap}.stats{gap:16px;flex-wrap:wrap}.login{gap:30px;grid-template-columns:1fr 1fr}}@media(max-width:650px){aside{position:static;width:auto;padding:12px 20px;display:flex;align-items:center;gap:10px}.logo{font-size:26px;margin:0}.logo span,.aside-bottom{display:none}aside>button{width:auto;margin:0}main{margin:0;padding:22px 18px 150px}h1{font-size:36px}.hero{padding:25px}.toolbar input{width:100%}.row{gap:8px;grid-template-columns:minmax(140px,2fr) 45px 110px}.row button{font-size:11px;padding:7px}.art{width:40px;height:40px}.song{gap:8px}.song strong{font-size:11px}footer{left:0;padding:12px;flex-wrap:wrap;gap:8px}footer audio{width:100%}.login{display:block;padding:25px}.login h1{font-size:42px}.login form{margin-top:30px}header .eyebrow{font-size:9px}}.check{padding:18px;background:#edf3e5;border:1px solid #cbdaba;border-radius:10px;font-weight:700}.check input{accent-color:#254b3b;width:21px;height:21px;margin-right:8px}.logo{letter-spacing:-2px}.logo.login-logo{margin-bottom:32px;font-size:48px}.logo.login-logo span{display:block}
