.song-card{background:var(--color-panel1);border:1px solid var(--color-border);cursor:pointer;scroll-snap-align:start;border-radius:13px;flex-shrink:0;width:360px;padding:0;transition:transform .2s,border-color .2s,box-shadow .2s;overflow:hidden}.song-card:hover{border-color:var(--color-surface-muted);transform:translateY(-2px)}.sc-thumb{border-radius:0;height:200px;position:relative;overflow:hidden}.sc-cover{object-fit:cover;width:100%;height:100%;display:block}.sc-thumb-sheet{background:#f3f1f5;height:480px;padding:12px}.sc-score-preview{object-fit:contain;object-position:top center;box-sizing:border-box;background:#fff;border:1px solid #d6d2d8;border-radius:7px}.sc-sheet-processing{box-sizing:border-box;color:#767078;letter-spacing:.02em;background:#fff;border:1px solid #d6d2d8;border-radius:7px;justify-content:center;align-items:center;width:100%;height:100%;font-size:13px;display:flex}.sc-overlay{opacity:0;pointer-events:none;background:linear-gradient(#0000 30%,#0000008c 100%);transition:opacity .2s;position:absolute;inset:0}.song-card:hover .sc-overlay{opacity:1}.sc-overlay-play{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.sc-play-btn{background:var(--color-primary);color:#fff;opacity:0;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;transition:transform .2s,opacity .2s,background .15s;display:inline-flex;transform:scale(.85);box-shadow:0 8px 24px #0006}.song-card:hover .sc-play-btn{opacity:1;transform:scale(1)}.sc-overlay-cta{opacity:0;pointer-events:none;justify-content:flex-end;align-items:center;transition:opacity .2s,transform .2s;display:flex;position:absolute;bottom:12px;left:12px;right:12px;transform:translateY(4px)}.song-card:hover .sc-overlay-cta{opacity:1;transform:translateY(0)}.sc-open-pill{color:#000;letter-spacing:.3px;background:#fffffff2;border-radius:999px;padding:7px 14px;font-size:14px;font-weight:600}.sc-diff-wrap{position:absolute;top:10px;left:10px}.sc-diff{letter-spacing:.3px;text-transform:uppercase;color:#fff;border-radius:7px;align-items:center;gap:5px;padding:4px 10px;font-size:13px;font-weight:600;display:inline-flex}.sc-diff:before{content:"";background:#ffffffd9;border-radius:50%;width:7px;height:7px}.sc-diff-beginner{background:#16a34a}.sc-diff-intermediate{background:#f59e0b}.sc-diff-advanced{background:#ef4444}.sc-skill-wrap{max-width:60%;position:absolute;top:10px;right:10px}.sc-skill-tag{color:#fff;white-space:nowrap;text-overflow:ellipsis;background:#0000008c;border:1px solid #ffffff2e;border-radius:999px;align-items:center;max-width:100%;padding:4px 10px;font-size:13px;font-weight:500;display:inline-flex;overflow:hidden}.sc-meta{flex-direction:column;gap:7px;padding:14px;display:flex}.sc-title{color:var(--color-text);white-space:nowrap;text-overflow:ellipsis;font-size:18px;font-weight:600;overflow:hidden}.sc-artist{color:var(--color-muted-foreground);white-space:nowrap;text-overflow:ellipsis;font-size:15px;overflow:hidden}.sc-row{justify-content:space-between;align-items:center;gap:8px;margin-top:2px;display:flex}.sc-genre{color:var(--color-muted-foreground);white-space:nowrap;text-overflow:ellipsis;font-size:14px;overflow:hidden}.sc-stats{flex-shrink:0;align-items:center;gap:8px;display:inline-flex}.sc-views{color:var(--color-muted-foreground);align-items:center;gap:4px;font-size:13px;display:inline-flex}.sc-stars{color:#f59e0b;align-items:center;gap:3px;display:inline-flex}.sc-rating{color:var(--color-muted-foreground);margin-left:2px;font-size:13px;font-weight:500}.sc-formats{border-top:1px dashed var(--color-border-light);align-items:center;gap:12px;margin-top:8px;padding-top:10px;display:inline-flex}.sc-formats span{letter-spacing:.6px;color:var(--color-muted-foreground);font-size:12px;font-weight:600;transition:color .15s;position:relative}.sc-formats span+span{padding-left:12px}.sc-formats span+span:before{content:"";background:var(--color-muted-foreground);opacity:.6;border-radius:50%;width:2px;height:2px;position:absolute;top:50%;left:0;transform:translateY(-50%)}.song-card:hover .sc-formats span{color:var(--color-foreground)}.song-card{position:relative}.sc-link{color:inherit;text-decoration:none}.sc-link:after{content:"";z-index:1;position:absolute;inset:0}.sc-link:focus-visible{outline:none}.song-card:has(.sc-link:focus-visible){outline:2px solid var(--color-primary);outline-offset:2px}.sc-creator{z-index:2;color:var(--color-muted-foreground);font-size:12px;text-decoration:none;position:relative}.card-thumb-placeholder{background:#151515;width:100%;height:100%}
