:root {
  --nsh-bg: #0d1117;
  --nsh-surface: #151b23;
  --nsh-surface-2: #1d2530;
  --nsh-text: #f4f7fb;
  --nsh-muted: #9ba7b4;
  --nsh-primary: #8b5cf6;
  --nsh-primary-2: #5b8cff;
  --nsh-border: rgba(255,255,255,.10);
  --nsh-radius: 1rem;
}
body { background: var(--nsh-bg); color: var(--nsh-text); min-height: 100vh; }
.nsh-navbar { background: rgba(13,17,23,.92); backdrop-filter: blur(16px); }
.nsh-hero { padding: 8rem 0 6rem; background: radial-gradient(circle at 20% 20%, rgba(139,92,246,.22), transparent 35%), radial-gradient(circle at 80% 10%, rgba(91,140,255,.18), transparent 30%); }
.nsh-card { background: var(--nsh-surface); border: 1px solid var(--nsh-border); border-radius: var(--nsh-radius); }
.nsh-gradient-text { background: linear-gradient(90deg, var(--nsh-primary), var(--nsh-primary-2)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.btn-nsh { background: linear-gradient(90deg, var(--nsh-primary), var(--nsh-primary-2)); border: 0; color: white; }
.btn-nsh:hover { color:white; filter: brightness(1.08); }
.form-control { background: var(--nsh-surface-2); border-color: var(--nsh-border); color: var(--nsh-text); }
.form-control:focus { background: var(--nsh-surface-2); color: var(--nsh-text); border-color: var(--nsh-primary); box-shadow: 0 0 0 .2rem rgba(139,92,246,.15); }

.nsh-admin-nav { background: rgba(10, 13, 20, .94); backdrop-filter: blur(10px); }
.nsh-admin-nav .nav-link { color: var(--nsh-muted, #a7b0c0); }
.nsh-admin-nav .nav-link:hover { color: #fff; }
.nsh-card.d-block:hover { transform: translateY(-2px); border-color: rgba(255,255,255,.2); }
.table-dark { --bs-table-bg: transparent; --bs-table-striped-bg: rgba(255,255,255,.025); }
.form-control, .form-select { background-color: rgba(255,255,255,.045); color: #fff; border-color: rgba(255,255,255,.12); }
.form-control:focus, .form-select:focus { background-color: rgba(255,255,255,.065); color: #fff; }
.form-select option { color:#111; }
.nsh-cover { aspect-ratio: 1/1; object-fit: cover; box-shadow: 0 20px 60px rgba(0,0,0,.35); }
.nsh-thumb { aspect-ratio: 1/1; object-fit: cover; }
.nsh-cover-placeholder { aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; font-size:4rem; background:linear-gradient(135deg,var(--nsh-surface-2),var(--nsh-surface)); color:var(--nsh-muted); border:1px solid var(--nsh-border); }
a.nsh-card { transition: transform .18s ease,border-color .18s ease,background-color .18s ease; }
a.nsh-card:hover { transform:translateY(-3px); border-color:var(--nsh-primary); }

/* v0.4 Creator profile */
.creator-hero{background:linear-gradient(135deg,var(--nsh-surface),var(--nsh-bg));background-size:cover;background-position:center;min-height:320px;display:flex;align-items:end;border-bottom:1px solid rgba(255,255,255,.08)}
.creator-avatar{width:168px;height:168px;object-fit:cover;border-radius:28px;border:4px solid rgba(255,255,255,.9);box-shadow:0 18px 50px rgba(0,0,0,.35);background:var(--nsh-surface)}
.creator-bio{font-size:1.05rem;line-height:1.8}
.nsh-badge-soft{background:color-mix(in srgb,var(--nsh-primary) 24%,transparent);color:#fff;border:1px solid color-mix(in srgb,var(--nsh-primary) 55%,transparent)}
@media(max-width:767.98px){.creator-avatar{width:118px;height:118px;border-radius:22px}.creator-hero{min-height:260px}}

/* v0.5 Playlist listening experience */
.playlist-track-card{transition:transform .15s ease,border-color .15s ease}.playlist-track-card:hover{transform:translateY(-1px)}
.playlist-position{width:34px;min-width:34px;text-align:center;padding-top:.55rem;font-weight:700;color:var(--nsh-muted,#9aa4b2)}
.playlist-cover{width:76px;height:76px;object-fit:cover;flex:0 0 76px}
.spotify-embed-wrap{border-radius:12px;overflow:hidden;line-height:0;background:#121212}
.spotify-embed-wrap iframe{display:block;border:0}
.min-w-0{min-width:0}
@media (max-width:576px){.playlist-track-card{padding:1rem!important}.playlist-cover{width:58px;height:58px;flex-basis:58px}.playlist-position{width:24px;min-width:24px}.spotify-embed-wrap{margin-left:-82px}}

/* v0.5.1 Playlist layout/cache fix */
.playlist-track-layout{display:grid;grid-template-columns:34px 76px minmax(0,1fr);gap:1rem;align-items:start;width:100%}
.playlist-track-layout>.flex-grow-1{min-width:0;width:100%}
.playlist-cover{display:block;width:76px!important;height:76px!important;max-width:76px!important;min-width:76px!important;object-fit:cover!important}
.spotify-embed-wrap{width:100%;max-width:100%;overflow:hidden}
.spotify-embed-wrap iframe{display:block;width:100%!important;max-width:100%;height:152px}
@media(max-width:576px){.playlist-track-layout{grid-template-columns:24px 58px minmax(0,1fr);gap:.75rem}.playlist-cover{width:58px!important;height:58px!important;max-width:58px!important;min-width:58px!important}.spotify-embed-wrap{margin-left:0}}

/* v0.5.2 Cleaner playlist presentation */
.playlist-track-card-clean{background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.01));border-color:rgba(255,255,255,.09)}
.playlist-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}
.playlist-card-left{display:flex;align-items:flex-start;gap:1rem;min-width:0;flex:1 1 auto}
.playlist-position-clean{width:40px;min-width:40px;padding-top:.2rem;font-size:1.05rem;color:#c4d0de}
.playlist-cover-small{width:64px;height:64px;min-width:64px;object-fit:cover;box-shadow:0 10px 30px rgba(0,0,0,.28)}
.playlist-title-block{min-width:0}
.playlist-title-block h2{font-size:1.35rem;line-height:1.2}
.playlist-title-block a{white-space:normal;word-break:break-word}
.playlist-genre-badge{align-self:flex-start;margin-top:.15rem}
.spotify-embed-clean{border:1px solid rgba(255,255,255,.08);border-radius:16px;background:#121212;box-shadow:0 12px 30px rgba(0,0,0,.16)}
.playlist-note{max-width:860px;line-height:1.6}
@media(max-width:767.98px){
  .playlist-card-top{flex-direction:column;align-items:stretch}
  .playlist-card-left{gap:.75rem}
  .playlist-position-clean{width:28px;min-width:28px;font-size:1rem}
  .playlist-cover-small{width:56px;height:56px;min-width:56px}
  .playlist-title-block h2{font-size:1.15rem}
  .playlist-genre-badge{margin-left:2.5rem;align-self:flex-start}
}
