.playlist-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:22px}.playlist-card{border:1px solid #e0e6ef;border-radius:20px;background:#fff;overflow:hidden;box-shadow:0 10px 28px #17233a0b}.playlist-cover{height:150px;display:grid;place-items:center;position:relative;background:linear-gradient(135deg,#131e34,#3153a8);color:#fff;font-size:36px}.playlist-cover img{width:100%;height:100%;object-fit:cover}.playlist-cover b{position:absolute;right:10px;bottom:10px;padding:6px 9px;border-radius:8px;background:#0c1425dd;color:#fff;font-size:12px}.playlist-card>div{padding:16px}.playlist-card h3{margin:10px 0 5px;overflow-wrap:anywhere}.playlist-card p{color:#717b8d;font-size:13px;height:38px;overflow:hidden}.playlist-actions{display:flex;gap:16px}.playlist-actions a{font-weight:800;color:#2864df}.playlist-sortable{display:grid;gap:10px}.playlist-sort-item{display:grid;grid-template-columns:30px 120px minmax(0,1fr) auto;align-items:center;gap:14px;padding:10px;border:1px solid #e2e7ef;border-radius:14px;background:#fff}.playlist-sort-item.dragging{opacity:.45;border-color:#2864df}.drag-handle{cursor:grab;color:#7c8799;font-weight:900}.sort-thumb{height:68px;border-radius:10px;overflow:hidden;background:#101827;color:#fff;display:grid;place-items:center}.sort-thumb img{width:100%;height:100%;object-fit:cover}.playlist-sort-item strong,.playlist-sort-item small{display:block}.playlist-sort-item small{color:#747e90;margin-top:5px}.playlist-public{width:min(1080px,calc(100% - 32px));margin:42px auto 80px}.playlist-public-head{display:grid;grid-template-columns:380px 1fr;gap:34px;align-items:center;padding:30px;border-radius:28px;background:linear-gradient(135deg,#101a30,#203e80);color:#fff}.playlist-hero-thumb{height:220px;border-radius:20px;background:#080d17;overflow:hidden;display:grid;place-items:center;font-size:45px}.playlist-hero-thumb img{width:100%;height:100%;object-fit:cover}.playlist-public-head h1{font-size:clamp(30px,4vw,48px);margin:7px 0 12px;overflow-wrap:anywhere}.playlist-public-head p{color:#d4dcf1;line-height:1.6}.playlist-by{margin:15px 0;color:#bfc9e2}.playlist-by a{color:#fff;font-weight:900}.playlist-public-list{display:grid;gap:10px;margin-top:24px}.playlist-public-list article{display:grid;grid-template-columns:36px 190px 1fr;gap:17px;align-items:center;padding:12px;border:1px solid #e1e6ef;border-radius:16px;background:#fff}.playlist-number{text-align:center;color:#738096;font-weight:900}.playlist-row-thumb{height:105px;border-radius:12px;overflow:hidden;background:#111827;color:#fff;display:grid;place-items:center}.playlist-row-thumb img{width:100%;height:100%;object-fit:cover}.playlist-public-list h2{font-size:18px;margin:0 0 7px;color:#172033;overflow-wrap:anywhere}.playlist-public-list p{margin:0;color:#737e90}@media(max-width:850px){.playlist-grid{grid-template-columns:repeat(2,1fr)}.playlist-public-head{grid-template-columns:1fr}.playlist-hero-thumb{height:260px}}@media(max-width:560px){.playlist-grid{grid-template-columns:1fr}.playlist-sort-item{grid-template-columns:24px 88px minmax(0,1fr)}.playlist-sort-item>.danger-link{grid-column:3}.playlist-public{width:calc(100% - 20px)}.playlist-public-head{padding:18px;border-radius:20px}.playlist-hero-thumb{height:190px}.playlist-public-list article{grid-template-columns:25px 110px 1fr}.playlist-row-thumb{height:70px}.playlist-public-list h2{font-size:14px}}
.save-playlist-panel{display:flex;align-items:center;justify-content:space-between;gap:20px}.save-playlist-panel h2,.save-playlist-panel p{margin:0}.save-playlist-panel p{margin-top:4px}.save-playlist-panel form{display:flex;align-items:center;gap:10px;margin:0}.save-playlist-panel select{min-width:190px}.save-playlist-panel form>a{font-weight:800;color:#2864df}@media(max-width:650px){.save-playlist-panel,.save-playlist-panel form{align-items:stretch;flex-direction:column}.save-playlist-panel select{width:100%}}