/* FreshMusic - public design */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:#fff;color:#222;font:700 13px/1.45 Verdana,Tahoma,Arial,sans-serif;-webkit-text-size-adjust:100%}
a{color:#1a1aff;text-decoration:none}
a:hover{color:#d4189a}
img{max-width:100%}
h1,h2{margin:0}

.top-strip{background:#ff3399;color:#fff;text-align:center;font-size:12px;padding:4px 6px}
.logo{display:block;text-align:center;padding:10px 8px;background:#fff}
.logo img{max-height:90px;vertical-align:middle}
.logo-text{display:block;font:italic 800 38px/1.1 Georgia,"Times New Roman",serif;color:#00b4d8;text-shadow:2px 2px 0 #ffd1ea}
.logo-text b{color:#ff3399}
.logo-tag{display:block;font:italic 700 14px Georgia,serif;color:#e6007e;margin-top:2px}

.search{background:#ff3399;color:#fff;text-align:center;padding:9px 8px 8px}
.search label{display:block;margin-bottom:4px}
.search input{width:min(300px,80%);padding:5px 8px;border:1px solid #c0c0c0;border-radius:3px;font-size:13px}
.sbtns{margin-top:5px;display:flex;justify-content:center;gap:4px}
.sbtns button{padding:2px 10px;font-size:13px;cursor:pointer;border:1px solid #888;border-radius:3px;background:linear-gradient(#fff,#e6e6e6)}
.sbtns button:hover{background:#fff7b0}

.bar{background:#38bdf0;color:#fff;text-align:center;padding:8px 6px;font-size:13px;letter-spacing:.3px;overflow-wrap:anywhere}
h2.sub{background:#e8f6fd;color:#0b6e99;font-size:12px;padding:6px 8px;border-bottom:1px solid #cfe9f6}
.sortline{text-align:center;font-weight:400;padding:6px;border-bottom:1px solid #e6e6e6;background:#fff}
.sortline b{font-weight:700}
.empty{padding:22px 10px;text-align:center;color:#666;font-weight:400}

.newrel{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;padding:10px 8px;background:#fff;border-bottom:1px solid #eee}
.newrel img{width:124px;height:124px;object-fit:cover;border:1px solid #bbb;padding:2px;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.18);display:block}
.newrel a:hover img{transform:translateY(-2px);box-shadow:0 5px 12px rgba(0,0,0,.28)}

.lu .row{padding:9px 8px;border-bottom:1px solid #e3e3e3;overflow-wrap:anywhere}
.lu .row:hover{background:#fbfbff}
.lu .star{color:#1a1aff}
.lu .n{font-weight:400}
.lu .go{color:#1a1aff}
.morebtn{display:inline-block;background:#38bdf0;color:#fff;padding:5px 16px;border:2px outset #bde}
.morebtn:hover{color:#fff;background:#1fa8dd}
.top35{background:#f3ecf8;text-align:center;padding:6px 4px;line-height:1.7}
.top35 b{display:block;color:#000}
.top35 span{color:#555;margin:0 5px}

.menu a{display:flex;align-items:center;gap:8px;padding:10px 8px;border-bottom:1px solid #e6e6ee;background:#f8f8fc}
.menu a:hover{background:#eaf6ff;color:#d4189a}
.menu .ic{flex:0 0 20px;text-align:center}
.menu .ic.a{color:#1f6fd0}.menu .ic.v{color:#6a4fb0}
.menu .cnt{color:#555;font-weight:700;margin-left:2px}
.menu.sub a{background:#fff}

.tlist{background:#fff}
.trow{display:flex;gap:9px;align-items:center;padding:8px;border-bottom:1px solid #ececf2;background:#fafafd;color:inherit}
a.trow:hover{background:#eef7ff}
.th{width:76px;height:76px;object-fit:cover;border:1px solid #bbb;padding:2px;background:#fff;flex:0 0 76px;box-shadow:0 1px 3px rgba(0,0,0,.15)}
.tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.tx .t{color:#1a1aff;overflow-wrap:anywhere}
.tx .t i{font-style:normal;color:#e8272a}
.tx .sg{font-weight:400}.tx .sg span{color:#e68a00}
.tx .al{font-weight:400}.tx .al a{color:#25a96a}
.tx .mt{font-weight:400;color:#333}

.pager{background:#eeeaf7;padding:7px 4px;font-weight:400}
.pg{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:4px}
.pg a,.pg b{min-width:26px;text-align:center;padding:3px 7px;border:1px solid #b9c4d6;border-radius:4px;background:#fff;font-weight:700}
.pg b{background:#ffe066;border-color:#e2c038}
.pginfo{margin:2px 0}
.jump input{width:54px;padding:1px 3px}
.jump button{padding:1px 6px;cursor:pointer}

.crumbs{background:#f3f0ec;padding:8px;line-height:1.7}
.crumbs span{margin:0 2px}
.crumbs b{color:#1a1aff}
.foot{background:#38bdf0;color:#fff;text-align:center;padding:9px 6px;font-size:12px;line-height:1.7}
.foot a{color:#fff}.foot a:hover{color:#fff4a8}
.flinks span{margin:0 6px}
.ftxt{font-weight:400;font-size:11px;margin-top:3px}
.notice{background:#fff7d6;border-top:1px solid #f0d878;padding:8px;font-size:12px;font-weight:400}

.albhead{text-align:center;padding:8px 6px;border-bottom:1px solid #e3e3e3}
.albcover{width:200px;height:200px;object-fit:cover;border:2px solid #ccc;padding:2px;background:#fff;box-shadow:0 3px 10px rgba(0,0,0,.2)}
.albsinger{margin-top:6px}

.trackbox{background:#efeaf8;text-align:center;padding:10px 8px 14px}
.tcover{width:154px;height:154px;object-fit:cover;border:2px solid #ccc;padding:2px;background:#fff;box-shadow:0 3px 10px rgba(0,0,0,.2)}
.player{max-width:460px;margin:12px auto 0;background:#fff;border:1px solid #cfe3f3;border-radius:12px;padding:10px 12px;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.ptitle{font-size:12px;color:#0b6e99;text-align:left;margin-bottom:6px}
.ptitle span{display:block;color:#222;font-weight:400;margin-top:1px;overflow-wrap:anywhere}
.player audio,.player video{width:100%;display:block;outline:none}
.player video{max-height:340px;background:#000;border-radius:6px}
.tdetails{text-align:center;padding:6px 8px}
.tdetails p{margin:9px 0;font-weight:400}
.tdetails p a{color:#1a1aff}
.dlbox{text-align:center;padding:4px 8px 16px}
a.dl{display:block;width:min(262px,92%);margin:6px auto;padding:7px 10px;background:linear-gradient(#86c52f,#6aa81f);color:#fff;border-radius:6px;box-shadow:0 2px 0 #4f8213;letter-spacing:.3px}
a.dl small{font-weight:400;opacity:.95}
a.dl:hover{background:linear-gradient(#97d63d,#78b92a);color:#fff}
.goback{background:#f3f0ec;padding:8px 8px 0}

.letters,.tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;padding:8px;background:#f3ecf8}
.letters a,.tabs a{padding:4px 10px;border:1px solid #38bdf0;background:#fff;border-radius:4px}
.letters a.on,.tabs a.on{background:#ff3399;color:#fff;border-color:#ff3399}
.pagebody{padding:12px 10px;font-weight:400;line-height:1.7;overflow-wrap:anywhere}

@media (max-width:480px){
  .logo-text{font-size:30px}
  .newrel img{width:calc(50vw - 20px);height:calc(50vw - 20px);max-width:150px;max-height:150px}
  .th{width:62px;height:62px;flex-basis:62px}
}