.hero-playlist{padding:calc(72px + 5rem) 0 5rem}.hero-playlist h1{font-size:clamp(2.5rem,5vw,4rem);color:var(--snow);margin:1rem 0 1.2rem}.hero-playlist .hero-sub{color:var(--snow-60);font-size:1.05rem;font-weight:300;max-width:640px}.playlist-status{margin-top:2rem;display:flex;flex-wrap:wrap;align-items:center;gap:.8rem;font-size:.9rem}.pl-badge{display:inline-block;padding:.35rem .9rem;border-radius:999px;font-size:.78rem;font-weight:700;letter-spacing:.04em}.pl-badge-on{background:var(--yellow);color:var(--independence)}.pl-badge-off{background:#fffcff26;color:var(--snow);border:1px solid rgba(255,252,255,.3)}.pl-badge-warn{background:#fffcff1a;color:var(--snow-60)}.pl-status-info{color:var(--snow-60)}.pl-status-info strong{color:var(--snow);font-weight:600}.pl-section-title{font-size:clamp(1.4rem,2.5vw,2rem);color:var(--independence);margin-bottom:1.5rem;padding-bottom:.6rem;border-bottom:2px solid var(--yellow);display:inline-block}.pl-hr{border:none;border-top:1px solid rgba(66,62,92,.1);margin:3rem 0 2rem}.playlist-form{max-width:640px}.pl-row{margin-bottom:1.1rem}.pl-row-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.pl-field{display:flex;flex-direction:column;gap:.4rem}.pl-field label{font-size:.78rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--independence)}.pl-field input{padding:.7rem 1rem;border:1px solid rgba(66,62,92,.2);border-radius:var(--radius);font-family:var(--font-body);font-size:.95rem;color:var(--independence);background:var(--cultured);transition:border-color var(--transition),background var(--transition)}.pl-field input:focus{outline:none;border-color:var(--yellow);background:var(--snow)}.pl-submit-row{margin-top:1.4rem;display:flex;flex-wrap:wrap;align-items:center;gap:1rem}.pl-hint{font-size:.78rem;color:#7a7490;flex:1;min-width:200px}.pl-form-msg{margin-top:1rem;padding:.75rem 1rem;background:var(--cultured);border-left:3px solid var(--yellow);border-radius:0 var(--radius) var(--radius) 0;font-size:.9rem;color:var(--independence);opacity:0;transition:opacity var(--transition)}.pl-form-msg.show{opacity:1}.pl-suggest{margin-top:.5rem;font-size:.82rem;color:#5a5470;line-height:1.5}.pl-suggest a{color:var(--independence);font-weight:600;text-decoration:none;border-bottom:1.5px solid var(--yellow);padding-bottom:1px;white-space:nowrap}.pl-suggest a:hover{color:var(--yellow)}.pl-yt-results{margin-top:.6rem;display:flex;flex-direction:column;gap:.4rem}.pl-yt-title{font-size:.78rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--independence);margin-bottom:.4rem}.pl-yt-item{display:flex;align-items:center;gap:.8rem;padding:.5rem;background:var(--cultured);border:1px solid rgba(66,62,92,.1);border-radius:var(--radius);cursor:pointer;font-family:var(--font-body);text-align:left;width:100%;transition:background var(--transition),border-color var(--transition),transform var(--transition)}.pl-yt-item:hover{background:var(--snow);border-color:var(--yellow);transform:translate(2px)}.pl-yt-thumb{width:90px;height:68px;object-fit:cover;border-radius:3px;flex-shrink:0}.pl-yt-info{flex:1;min-width:0}.pl-yt-vid-title{font-size:.88rem;font-weight:600;color:var(--independence);line-height:1.3;margin-bottom:.2rem;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.pl-yt-channel{font-size:.78rem;color:#7a7490}.pl-yt-use{font-size:.78rem;font-weight:700;color:var(--independence);background:var(--yellow);padding:.3rem .6rem;border-radius:999px;flex-shrink:0;white-space:nowrap}@media(max-width:500px){.pl-yt-thumb{width:70px;height:52px}.pl-yt-use{display:none}}.playlist-closed{background:#423e5c0a;border-left:3px solid var(--independence);padding:1.2rem 1.5rem;border-radius:0 var(--radius) var(--radius) 0;margin-bottom:2.5rem;color:var(--independence);font-size:.95rem;line-height:1.6}.pl-list-wrap{margin-top:2.5rem}.playlist-empty{text-align:center;padding:3rem 1rem;color:#7a7490;font-size:1rem}.playlist-list{display:flex;flex-direction:column;gap:.6rem}.pl-item{display:flex;align-items:center;gap:1.2rem;background:var(--cultured);border-radius:var(--radius);padding:1rem 1.2rem;transition:background var(--transition),transform var(--transition)}.pl-item:hover{background:var(--snow);transform:translate(2px);box-shadow:0 2px 10px #423e5c0d}.pl-item-top{border-left:4px solid var(--yellow);padding-left:calc(1.2rem - 4px)}.pl-vote{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:var(--snow);border:1.5px solid rgba(66,62,92,.15);border-radius:var(--radius);padding:.5rem .8rem;cursor:pointer;font-family:var(--font-body);min-width:60px;transition:all var(--transition);flex-shrink:0}.pl-vote:hover:not(.disabled):not(.voted){border-color:var(--yellow);transform:translateY(-1px)}.pl-vote.voted{background:var(--yellow);border-color:var(--yellow);color:var(--independence);cursor:pointer}.pl-vote.voted:hover:not(.disabled){background:#ffc84a;transform:translateY(-1px)}.pl-vote.disabled{opacity:.5;cursor:not-allowed}.pl-vote-heart{font-size:1.1rem;line-height:1}.pl-vote-count{font-size:.88rem;font-weight:700;line-height:1}.pl-item-main{flex:1;min-width:0}.pl-item-title{font-size:1rem;color:var(--independence);line-height:1.3;margin-bottom:.3rem}.pl-item-sep{color:#7a7490;margin:0 .3rem}.pl-item-artist{color:#5a5470;font-weight:500}.pl-item-meta{display:flex;flex-wrap:wrap;gap:.8rem 1rem;align-items:center;font-size:.82rem;color:#7a7490}.pl-item-meta strong{color:var(--independence);font-weight:600}.pl-item-link{color:var(--independence);text-decoration:none;padding:.15rem .5rem;border:1px solid rgba(66,62,92,.15);border-radius:999px;font-size:.78rem;font-weight:600;transition:all var(--transition)}.pl-item-link:hover{background:var(--yellow);border-color:var(--yellow)}.pl-remove-own{font-family:var(--font-body);font-size:.76rem;font-weight:600;color:#c0392b;background:transparent;border:1px solid rgba(192,57,43,.3);padding:.15rem .55rem;border-radius:999px;cursor:pointer;transition:all var(--transition)}.pl-remove-own:hover{background:#c0392b;color:var(--snow);border-color:#c0392b}@media(max-width:640px){.pl-row-2{grid-template-columns:1fr}.pl-item{flex-direction:row;gap:.9rem;padding:.8rem 1rem}.pl-item-title{font-size:.95rem}}
