:root{
  --bar:#0ee790;  /* 固定绿色 */ 
}
*{box-sizing:border-box} html,body{height:100%}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}
.topbar{position:sticky;top:0;padding:12px 16px;display:flex;align-items:center}
.brand{display:flex;align-items:center;gap:12px}
.logo{height:34px}
.wrap{max-width:1200px;margin:16px auto;padding:0 16px}
.grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.card{border-radius:18px;padding:12px}
.cover{position:relative;border-radius:14px;overflow:hidden}
.cover img{display:block;width:100%;height:auto}
.rtp{margin-top:10px;height:22px;border-radius:12px;overflow:hidden;border:1px solid #ccc}
.rtp-fill{height:100%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:#fff;background:var(--bar);transition:width .8s ease}
@media(max-width:1100px){.grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:820px){.grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.grid{grid-template-columns:repeat(2,1fr)}}