*{margin:0;padding:0;box-sizing:border-box;font-family:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
body{background:#0b0e14;color:#f0f3fa;min-height:100vh;padding:1.5rem 1rem 3rem;display:flex;justify-content:center}
.container{max-width:800px;width:100%;position:relative;z-index:2}

.video-bg{position:fixed;top:0;left:0;width:100vw;height:100vh;object-fit:cover;z-index:-2;opacity:.4;filter:brightness(.8) saturate(1.1);pointer-events:none}
.video-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0, 0, 0, 0.6);z-index:-1;transition:background 1s ease}

/* Updated Show Header */
.show-header{padding-top:10px;text-align:center;margin-bottom:2.1rem}
.show-header img{max-width:470px;min-width:375px;width:auto;height:auto;display:block;margin:0 auto 1rem;border-radius:0px;}
.show-header .show-title{font-size:2rem;font-weight:700;margin-bottom:.25rem;letter-spacing:-.5px}
.show-header .show-description{color:#e1e6ef;font-size:1rem;line-height:1.5;max-width:650px;margin:.5rem auto 0;opacity:1}
.show-header a {font-weight: bold; opacity: .6;}

/* Episode Header */
.episode-header{text-align:center;margin-bottom:1.5rem}
.episode-header .episode-title{font-size:1.4rem;font-weight:600;color:#fff;margin-bottom:.1rem}
.episode-header .episode-description{color:#cccfd6;font-size:.95rem;line-height:1.6;max-width:600px;margin:.2rem auto 0;opacity:.8}

.player-card{background:rgba(18,24,34,.75);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:8px;padding:1.2rem 1.5rem;margin-bottom:2rem;box-shadow:0 20px 40px rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.06);position:relative}
.download-link{position:absolute;top:.8rem;right:1rem;color:#8a9bb8;text-decoration:none;font-size:.75rem;display:flex;align-items:center;gap:.3rem;transition:.15s;background:rgba(255,255,255,.05);padding:.2rem .6rem;border-radius:4px;border:1px solid rgba(255,255,255,.05)}
.download-link:hover{color:#fff;background:rgba(255,255,255,.1)}
.download-link svg{width:16px;height:16px;fill:currentColor}
.download-link span{display:none}

.player-grid{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem}
.player-art{flex:0 0 80px;width:80px;height:80px;border-radius:4px;background:#1f2836;box-shadow:0 8px 20px rgba(0,0,0,.5);overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.player-art img{width:100%;height:100%;object-fit:cover;display:block}
.player-meta{flex:2 1 200px;min-width:150px}
.player-meta .artist{font-size:.85rem;font-weight:400;letter-spacing:.3px;color:#a5b9e0;margin-bottom:.1rem}
.player-meta .title{font-size:1.4rem;font-weight:600;line-height:1.2;margin-bottom:.2rem;word-break:break-word}
.player-meta .meta-row{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.player-meta .nation-year{color:#8a9bb8;font-size:.7rem;letter-spacing:.3px}
.player-meta .set-badge{display:inline-block;background:rgba(255,255,255,.07);padding:.15rem .5rem;border-radius:4px;font-size:.7rem;letter-spacing:.4px;color:#bac8f0;border:1px solid rgba(255,255,255,.04)}
.player-meta .set-badge strong{font-weight:700;color:#fff}
.spotify-icon{display:inline-flex;align-items:center;justify-content:center;color:#1db954;text-decoration:none;transition:.15s;margin-left:.2rem;vertical-align:middle;opacity:.8}
.spotify-icon:hover{color:#1ed760;opacity:1;transform:scale(1.05)}
.spotify-icon svg{width:20px;height:20px;fill:currentColor}

.audio-wrapper{width:100%;margin-top:.8rem}
.custom-audio{display:flex;align-items:center;gap:.8rem;background:rgba(0,0,0,.3);padding:.3rem .8rem;border-radius:4px;border:1px solid rgba(255,255,255,.06)}
.play-btn{border:none;width:40px;height:40px;border-radius:50%;cursor:pointer;font-size:1.2rem;display:flex;align-items:center;justify-content:center;transition:.15s;flex-shrink:0;background:#fff;color:#1a2744}
.play-btn:hover{transform:scale(1.05)}
.play-btn:active{transform:scale(.95)}
.play-btn.playing{background:#3a5a7a;color:#fff}
.time-display{font-size:.8rem;color:#bac8f0;font-variant-numeric:tabular-nums;min-width:70px;letter-spacing:.3px;flex-shrink:0}
.progress-container{flex:1;position:relative;cursor:pointer;height:4px;background:rgba(255,255,255,.15);border-radius:4px;min-width:60px}
.progress-bar{height:100%;width:0%;background:#3a5a7a;border-radius:4px;transition:width .1s linear}

/* Sets Grid */
.sets-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:.5rem}
.set-card{background:0 0;border-radius:4px;padding:.6rem .4rem .4rem;border:1px solid rgba(255,255,255,.03);transition:.2s;display:flex;flex-direction:column;min-height:320px;width:100%;min-width:0}
.set-card:hover{background:rgba(24,34,50,.6);backdrop-filter:blur(4px);border-color:rgba(255,255,255,.08)}
.set-header{text-align:center;padding-bottom:.5rem;margin-bottom:.6rem;flex-shrink:0}
.set-header h3{font-weight:400;font-size:.9rem;letter-spacing:.3px;color:#fff}
.set-header h3 strong{font-weight:700}
.track-list{list-style:none;padding:0;margin:0;flex:1;overflow-y:auto;min-height:250px;max-height:320px;scrollbar-width:thin;scrollbar-color:#3b4866 transparent}
.track-list::-webkit-scrollbar{width:4px}
.track-list::-webkit-scrollbar-track{background:0 0;border-radius:4px}
.track-list::-webkit-scrollbar-thumb{background:#3b4866;border-radius:4px}
.track-list li{display:flex;align-items:center;gap:.5rem;padding:.35rem .4rem;border-radius:4px;cursor:pointer;transition:background .1s;font-size:.8rem;border-bottom:1px solid rgba(255,255,255,.02)}
.track-list li:hover{background:rgba(255,255,255,.05)}
.track-list li:active{background:rgba(255,255,255,.08)}
.track-list li.active-track{background:rgba(255,255,255,.15);border-left:3px solid #3a5a7a;padding-left:.3rem}
.track-list li.active-track .track-artist{color:#fff}
.track-list li.active-track .track-title{color:#fff}
.track-list li.active-track .track-number{color:#8a9bb8}
.track-number{color:#6a7a95;font-size:.7rem;min-width:28px;text-align:right;flex-shrink:0;font-variant-numeric:tabular-nums}
.track-artist{color:#b8cbf5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:1;min-width:0}
.track-title{color:#8a9bb8;white-space:nowrap;font-weight:400;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.track-meta{color:#6a7a95;font-size:.6rem;white-space:nowrap;flex-shrink:0;text-align:right;min-width:70px}

/* Show/Episode Selector */
.selector-wrapper{max-width:500px;margin:1.5rem auto 0;text-align:center}
.selector-wrapper select{width:100%;padding:.7rem .8rem;background:rgba(18,24,34,.85);border:1px solid rgba(255,255,255,.08);border-radius:6px;color:#e6edf5;font-size:.9rem;font-family:inherit;outline:none;cursor:pointer;transition:.2s;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238a9bb8' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .8rem center}
.selector-wrapper select:hover{border-color:rgba(255,255,255,.15)}
.selector-wrapper select:focus{border-color:#3a5a7a;box-shadow:0 0 20px rgba(58,90,122,.15)}
.selector-wrapper select option{padding:.4rem;background:#141c28;color:#e6edf5}
.selector-wrapper select optgroup{font-weight:700;color:#fff;background:#141c28}
.selector-wrapper select optgroup option{font-weight:400;padding-left:.5rem;color:#b8cbf5}

.footer-links{text-align:center;margin-top:1.5rem;padding-top:.5rem;display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}
.footer-links a{color:#fff;text-decoration:none;font-size:.85rem;display:inline-flex;align-items:center;gap:.5rem;transition:.15s;padding:.3rem 1rem;border-radius:4px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)}
.footer-links a:hover{background:rgba(255,255,255,.15);transform:scale(1.02)}
.footer-links a svg{width:18px;height:18px;stroke:#fff}

.loading-placeholder{text-align:center;padding:3rem 1rem;color:#7b8bb0}
 
/* Style for links in description fields */
.show-description a,
.episode-description a {
    color: #dedede;
    text-decoration: none;
    transition: color 0.2s ease;
}

.show-description a:hover,
.episode-description a:hover {
    color: #ffffff;
    text-decoration: underline;
} 
 
@media(max-width:600px){
.sets-grid{grid-template-columns:1fr;gap:.8rem}
.set-card{min-height:auto;background:0 0;padding:.4rem .2rem}
.set-card:hover{background:0 0;backdrop-filter:none}
.track-list{min-height:auto;max-height:none;overflow-y:visible}
.player-art{flex:0 0 70px;width:70px;height:70px}
.player-meta .artist{font-size:1rem}
.player-meta .title{font-size:1.3rem}
.player-meta .meta-row{font-size:.9rem}
.player-meta .nation-year{font-size:.8rem}
.show-header .show-title{font-size:1.5rem}
.show-header img{max-width:200px}
.show-header .show-description {font-size: 1rem}
.episode-header .episode-title{font-size:1.2rem}
.episode-header .episode-description {font-size: 1rem; opacity: .8; line-height: 1.5rem;}
.custom-audio{padding:.3rem .6rem;gap:.5rem}
.play-btn{width:37px;height:37px;font-size:1.5rem;margin-right:8px;}
.time-display{min-width: 30px;}
.set-header h3 {font-size: 1.1rem}
.track-number{min-width:24px;font-size:.9rem}
.track-artist{font-size:.9rem}
.track-title{font-size:.9rem}
.download-link{font-size:.65rem;padding:.15rem .5rem;top:.5rem;right:.6rem}
.download-link span{display:none}
.track-meta{font-size:.8rem;min-width:60px;opacity:.9}
.selector-wrapper select{font-size:.9rem;padding:.6rem .7rem}
}
@media(max-width:400px){
.player-card{padding:.8rem}
.player-art{flex:0 0 60px;width:60px;height:60px}
.player-meta .title{font-size:1rem}
.show-header .show-title{font-size:1.2rem}
.show-header .show-description{font-size:.85rem}
}