:root{--bg:#f4f6fa;--panel:#fff;--text:#172033;--muted:#667085;--line:#e4e8f0;--accent:#2457d6;--accent2:#173d9e;--soft:#eef3ff;--radius:18px;--shadow:0 10px 30px rgba(31,42,68,.08)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.45 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,select{font:inherit}button{cursor:pointer}a{color:var(--accent);text-decoration:none}.site-header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px max(20px,calc((100vw - 1500px)/2));background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}.brand{display:flex;align-items:center;gap:12px}.brand-mark{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--accent);color:#fff;font-size:28px;font-weight:800}.brand-company,.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-weight:800}.eyebrow{margin:0;color:var(--accent)}h1{font-size:22px;margin:0}.languages{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}.languages a{padding:5px 7px;border-radius:7px;color:var(--muted);font-size:12px;font-weight:700}.languages a.active{background:var(--soft);color:var(--accent)}.page{max-width:1500px;margin:0 auto;padding:24px 20px 48px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.hero{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:26px}.hero h2{max-width:820px;margin:.25rem 0 .65rem;font-size:clamp(22px,3vw,34px);line-height:1.15}.privacy-note{margin:0;color:var(--muted)}.hero-actions,.export-actions,.playlist-actions{display:flex;gap:10px;flex-wrap:wrap}.btn{border:1px solid var(--line);background:#fff;color:var(--text);padding:10px 14px;border-radius:11px;font-weight:700}.btn:hover{background:#f8f9fc}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn.primary:hover{background:var(--accent2)}.btn.small{padding:7px 10px;font-size:13px}.icon-btn{border:0;background:transparent;font-size:18px;border-radius:8px;padding:6px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:16px 0}.stat{padding:18px}.stat span{display:block;font-size:28px;font-weight:850}.stat small{color:var(--muted)}.toolbar{display:grid;grid-template-columns:minmax(220px,1fr) repeat(6,minmax(105px,auto));gap:10px;padding:14px;margin-bottom:16px}.search,select,.edit-input,.bpm-filter{width:100%;border:1px solid #d8deea;background:#fff;border-radius:10px;padding:10px 11px;color:var(--text);outline:none}.bpm-filter{min-width:90px;text-align:center}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:16px;align-items:start}.library,.playlist,.player{padding:18px}.playlist{position:sticky;top:93px}.section-head{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:12px}.section-head h2{margin:2px 0 0;font-size:21px}.status{display:none;margin:10px 0;padding:10px 12px;border-radius:10px;background:#eef6ff;color:#1849a9}.status.show{display:block}.track-list{display:flex;flex-direction:column;gap:8px}.track{display:grid;grid-template-columns:44px minmax(180px,1.5fr) minmax(130px,1fr) 65px 58px 90px 128px 150px 80px 42px 42px;gap:8px;align-items:center;padding:9px;border:1px solid var(--line);border-radius:12px;background:#fff}.track:hover{border-color:#c9d5f4;background:#fbfcff}.play-btn{width:38px;height:38px;border-radius:50%;border:0;background:var(--soft);color:var(--accent);font-size:16px}.track-main{min-width:0}.track-title{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-sub,.track-album{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stars{display:flex;gap:1px;white-space:nowrap}.star{border:0;background:transparent;padding:1px;color:#c5cad3;font-size:18px}.star.on{color:#f0a000}.track select,.track .edit-input{padding:7px 6px;font-size:12px}.add-btn{border:0;background:var(--soft);color:var(--accent);border-radius:9px;width:36px;height:36px;font-size:20px;font-weight:700}.empty{text-align:center;color:var(--muted);padding:35px 12px}.empty.compact{padding:18px 6px}.load-more{display:block;margin:16px auto 0}.playlist-list{display:flex;flex-direction:column;gap:7px;max-height:55vh;overflow:auto}.playlist-item{display:grid;grid-template-columns:32px 1fr auto;gap:8px;align-items:center;padding:8px;border:1px solid var(--line);border-radius:10px}.playlist-num{font-size:12px;color:var(--muted);font-weight:700}.playlist-name{min-width:0}.playlist-name strong,.playlist-name small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playlist-name small{color:var(--muted)}.playlist-tools{display:flex}.playlist-tools button{border:0;background:transparent;border-radius:6px;padding:4px}.playlist-actions{margin-top:12px}.playlist-actions .btn{flex:1}.player{margin-top:16px;display:grid;grid-template-columns:minmax(180px,1fr) minmax(260px,2fr);gap:14px;align-items:center}.player small{grid-column:1/-1;color:var(--muted)}.now-playing span{display:block;color:var(--muted)}audio{width:100%}.ad-wrap{
  width:100%;
  min-width:0;
  min-height:90px;
  margin:16px 0;
  display:block;
  background:#fff;
  border:1px dashed #d4dae5;
  border-radius:14px;
  overflow:hidden;
}
.ad-wrap > ins.adsbygoogle{
  display:block!important;
  width:100%!important;
  min-width:1px!important;
  min-height:90px;
}.site-footer{display:flex;justify-content:space-between;gap:16px;max-width:1500px;margin:0 auto;padding:22px 20px 35px;color:var(--muted);font-size:13px}.site-footer span:last-child{display:flex;gap:12px}@media(max-width:1120px){.workspace{grid-template-columns:1fr}.playlist{position:static}.toolbar{grid-template-columns:1fr 1fr 1fr}.search{grid-column:1/-1}.track{grid-template-columns:42px minmax(160px,1fr) 58px 80px 110px 140px 72px 42px 42px}.track-album{display:none}}@media(max-width:720px){.site-header{position:static;padding:14px;align-items:flex-start}.languages{max-width:180px}.page{padding:14px 10px 36px}.hero{padding:18px;align-items:stretch;flex-direction:column}.hero-actions .btn{flex:1}.stats-grid{grid-template-columns:1fr 1fr;gap:8px}.stat{padding:13px}.stat span{font-size:23px}.toolbar{grid-template-columns:1fr 1fr;padding:10px}.search{grid-column:1/-1}.library,.playlist,.player{padding:12px}.section-head{align-items:flex-start;flex-direction:column}.export-actions{width:100%}.export-actions .btn{flex:1}.track{grid-template-columns:40px minmax(0,1fr) 42px;padding:10px}.track .stars{grid-column:2}.track-album,.track-year,.track-bpm,.track-dance,.track-genre{display:none}.add-btn{grid-column:3;grid-row:1}.play-btn{grid-column:1;grid-row:1}.player{grid-template-columns:1fr}.player small{grid-column:1}.site-footer{flex-direction:column}}

.brand-logo-link{display:flex;align-items:center;flex:0 0 auto}
.brand-logo{display:block;max-width:149px;height:56px;object-fit:contain}
.scan-panel{display:grid;grid-template-columns:58px minmax(0,1fr) auto auto;gap:18px;align-items:center;margin:16px 0;padding:18px 22px;border:2px solid #8ca9f1;background:linear-gradient(135deg,#f7faff,#eef4ff);box-shadow:0 12px 34px rgba(36,87,214,.12)}
.scan-panel[hidden]{display:none!important}
.scan-panel.active{animation:scanGlow 1.4s ease-in-out infinite alternate}
.scan-spinner{width:42px;height:42px;border:5px solid #cfdbfa;border-top-color:var(--accent);border-radius:50%;animation:scanSpin .85s linear infinite}
.scan-copy{min-width:0}.scan-copy strong{display:block;font-size:20px;color:#173d9e;margin-bottom:3px}.scan-copy span{display:block;color:#344054}.scan-copy small{display:block;margin-top:5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scan-count{min-width:86px;text-align:center;padding:9px 12px;border-radius:12px;background:#fff;border:1px solid #dce5fa}
.scan-count span{display:block;font-size:24px;font-weight:850;color:var(--accent)}.scan-count small{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.07em}
.ads-debug{margin-top:16px;padding:18px}.ads-debug h2{margin:.2rem 0 .7rem}
@keyframes scanSpin{to{transform:rotate(360deg)}}@keyframes scanGlow{from{box-shadow:0 10px 25px rgba(36,87,214,.08)}to{box-shadow:0 14px 38px rgba(36,87,214,.23)}}
@media(max-width:720px){
 .brand-logo{max-width:108px;height:auto;max-height:46px}
 .scan-panel{grid-template-columns:46px 1fr;gap:12px;padding:15px}
 .scan-spinner{width:36px;height:36px}
 .scan-copy strong{font-size:17px}
 .scan-count{min-width:0}.scan-count:nth-of-type(1){grid-column:1}.scan-count:nth-of-type(2){grid-column:2}
}


.track-duration{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums;text-align:center}
.delete-track-btn{border:0;background:#fff3f2;color:#b42318;border-radius:9px;width:36px;height:36px;font-size:16px}
.delete-track-btn:hover{background:#fee4e2}
@media(max-width:1120px){
 .track-year{display:none}
}
@media(max-width:720px){
 .track-duration{display:block;grid-column:2;font-size:12px;text-align:left}
 .delete-track-btn{grid-column:3;grid-row:2}
 .track .stars{grid-row:3}
}


/* ===== 0.1.9: Kopfbereich im Stil der anderen Hoffmann-Software-Seiten ===== */
.site-header{
  position:static;
  padding:0;
  background:#f4f7fb;
  border-bottom:1px solid #e1e7ef;
  box-shadow:none;
}
.header-inner{
  width:min(100%,1500px);
  margin:0 auto;
  min-height:96px;
  padding:18px 28px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}
.header-brand{
  display:flex;
  align-items:center;
  gap:20px;
  color:#102a43;
  min-width:0;
}
.header-logo{
  display:block;
  width:149px;
  height:56px;
  object-fit:contain;
  flex:0 0 auto;
}
.header-brand-text{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.header-brand-text strong{
  font-size:23px;
  line-height:1.1;
  font-weight:800;
  white-space:nowrap;
}
.header-brand-text small{
  margin-top:5px;
  color:#54647a;
  font-size:13px;
  font-weight:500;
}
.header-right{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:16px;
  min-width:0;
}
.top-links{
  display:flex;
  align-items:center;
  gap:22px;
  white-space:nowrap;
}
.top-links a{
  color:#102a43;
  font-size:14px;
  font-weight:750;
}
.top-links a:hover{color:var(--accent)}
.language-globe{font-size:18px}
.language-form select{
  width:auto;
  min-width:120px;
  padding:10px 34px 10px 14px;
  border-radius:10px;
  background:#fff;
}
.sr-only{
  position:absolute!important;
  width:1px!important;height:1px!important;
  padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;border:0!important;
}

/* Hero / SEO */
.hero-copy{max-width:900px}
.page-title{
  margin:.1rem 0 .2rem;
  font-size:clamp(25px,3vw,37px);
  line-height:1.1;
}
.hero h2{
  margin:.2rem 0 .5rem;
  font-size:clamp(18px,2vw,24px);
  color:#2e3e55;
  font-weight:650;
}
.hero-seo{
  max-width:850px;
  margin:.2rem 0 .55rem;
  color:#536176;
}
.seo-info{
  margin-top:16px;
  padding:20px 24px;
}
.seo-info h2{margin:0 0 7px;font-size:19px}
.seo-info p{margin:0;color:var(--muted);max-width:1100px}

/* ===== 0.1.9: kompaktere Musikliste ===== */
.track{
  grid-template-columns:
    42px
    minmax(240px,1fr)
    58px
    92px
    minmax(112px,128px)
    minmax(120px,145px)
    76px
    38px
    38px;
  gap:8px;
  padding:9px 10px;
  overflow:hidden;
}
.track-main{min-width:0}
.track-title{
  font-size:15px;
  line-height:1.2;
}
.track-meta,
.track-file{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.track-meta{
  margin-top:2px;
  font-size:12px;
  color:#657189;
}
.track-file{
  margin-top:1px;
  font-size:11px;
  color:#8a94a6;
}
.track-duration{
  font-size:13px;
  font-weight:700;
  color:#5d6b82;
  text-align:center;
  font-variant-numeric:tabular-nums;
}
.track .stars{
  justify-content:center;
}
.star{
  font-size:17px;
  padding:0;
}
.track select,
.track .edit-input{
  min-width:0;
  padding:7px 7px;
  font-size:12px;
}
.add-btn,
.delete-track-btn{
  width:36px;
  height:36px;
  flex:0 0 36px;
}
.delete-track-btn{
  border:0;
  background:#fff2f0;
  color:#d13b31;
  border-radius:9px;
  font-size:15px;
}
.delete-track-btn:hover{background:#ffe3df}

/* alte Einzelspalten werden ab 0.1.9 nicht mehr erzeugt */
.track-album,.track-year,.track-sub{display:none!important}

@media(max-width:1250px){
  .top-links{gap:14px}
  .track{
    grid-template-columns:
      42px minmax(220px,1fr) 56px 88px
      112px 124px 70px 38px 38px;
  }
}

@media(max-width:1120px){
  .header-inner{padding:16px 20px}
  .top-links{display:none}
  .track{
    grid-template-columns:
      42px minmax(220px,1fr) 56px 88px
      118px 130px 72px 38px 38px;
  }
}

@media(max-width:760px){
  .header-inner{
    min-height:auto;
    padding:12px 14px;
    align-items:flex-start;
    gap:12px;
  }
  .header-logo{width:98px;height:40px}
  .header-brand{gap:10px}
  .header-brand-text strong{font-size:17px}
  .header-brand-text small{font-size:11px;margin-top:2px}
  .header-right{gap:7px}
  .language-globe{display:none}
  .language-form select{min-width:96px;padding:8px 28px 8px 9px;font-size:12px}

  .track{
    grid-template-columns:38px minmax(0,1fr) 38px 38px;
    gap:7px;
    padding:10px 8px;
    align-items:center;
  }
  .play-btn{grid-column:1;grid-row:1}
  .track-main{grid-column:2;grid-row:1 / span 2}
  .add-btn{grid-column:3;grid-row:1}
  .delete-track-btn{grid-column:4;grid-row:1}
  .track-duration{
    grid-column:1;
    grid-row:2;
    font-size:11px;
  }
  .track .stars{
    grid-column:3 / span 2;
    grid-row:2;
    justify-content:flex-end;
  }
  .track-dance,.track-genre,.track-bpm{display:none!important}
}


/* ===== 0.2.0 Playlist-Player ===== */
.playlist-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}
.playlist-actions .playlist-play{
  grid-column:1/-1;
  width:100%;
}
.playlist-actions .btn{min-width:0}

.playlist-item{
  grid-template-columns:32px 28px minmax(0,1fr) auto;
  cursor:default;
  transition:border-color .15s,background .15s,box-shadow .15s;
}
.playlist-item:hover{
  border-color:#c7d4f5;
  background:#fbfcff;
}
.playlist-item.active{
  border-color:#8eabf4;
  background:#eef4ff;
  box-shadow:inset 3px 0 0 var(--accent);
}
.playlist-item-play{
  width:30px;
  height:30px;
  padding:0;
  border:0;
  border-radius:50%;
  background:var(--soft);
  color:var(--accent);
  font-size:12px;
}
.playlist-item.active .playlist-item-play{
  background:var(--accent);
  color:#fff;
}
.playlist-name{cursor:pointer}
.playlist-tools{gap:1px}

.player{
  grid-template-columns:minmax(220px,1fr) minmax(300px,1.8fr) minmax(220px,.9fr);
  gap:18px;
}
.player-current{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-width:0;
}
.player-label{
  display:block;
  margin-bottom:3px;
  font-size:10px;
  font-weight:850;
  letter-spacing:.12em;
  color:var(--accent);
}
.now-playing{min-width:0}
.now-playing strong,
.now-playing span:not(.player-label){
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.player-nav{
  display:flex;
  gap:6px;
  flex:0 0 auto;
}
.player-nav-btn{
  width:36px;
  height:36px;
  border:1px solid #d9e1ef;
  border-radius:10px;
  background:#fff;
  color:#274267;
  font-size:16px;
}
.player-nav-btn:hover{background:#f3f6fb}
.next-preview{
  min-width:0;
  padding:10px 12px;
  border:1px solid #e0e7f2;
  border-radius:12px;
  background:#f8faff;
}
.next-preview.has-next{background:#f3f7ff}
.next-preview strong,
.next-preview span,
.next-preview small{
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.next-preview span:not(.player-label),
.next-preview small{color:var(--muted)}
.player-hint{grid-column:1/-1!important}

.track-file{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}
.track-file>span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
.web-info-btn{
  flex:0 0 auto;
  border:0;
  border-radius:7px;
  padding:2px 6px;
  background:#f1f5ff;
  color:#2754b5;
  font-size:10px;
  font-weight:750;
}
.web-info-btn:hover{background:#e2ebff}

@media(max-width:1120px){
  .player{
    grid-template-columns:1fr 1.5fr;
  }
  .next-preview{
    grid-column:1/-1;
  }
}
@media(max-width:760px){
  .playlist-actions{grid-template-columns:1fr}
  .playlist-actions .playlist-play{grid-column:1}
  .playlist-item{
    grid-template-columns:30px 24px minmax(0,1fr) auto;
  }
  .player{
    grid-template-columns:1fr;
  }
  .next-preview{grid-column:1}
  .player-current{align-items:flex-start}
}


/* ===== 0.2.2: Player weiter oben / kompakte Bibliothek ===== */
.player{
  margin:16px 0;
  position:relative;
  z-index:2;
}
.player audio{min-width:260px}

/* Bibliothekszeile: nur Titel, Interpret, Dauer, Löschen, Aufklappen */
.track.compact-track{
  display:block;
  padding:0;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  overflow:hidden;
}
.track.compact-track:hover{
  border-color:#c9d5f4;
  background:#fff;
}
.track.compact-track.is-open{
  border-color:#9db4ee;
  box-shadow:0 5px 16px rgba(36,87,214,.08);
}
.track-summary{
  display:grid;
  grid-template-columns:minmax(0,1fr) 72px 40px 24px;
  gap:10px;
  align-items:center;
  min-height:54px;
  padding:8px 10px 8px 14px;
  cursor:pointer;
  outline:none;
}
.track-summary:hover{background:#f8faff}
.track-summary:focus-visible{
  box-shadow:inset 0 0 0 2px var(--accent);
}
.track-summary-main{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(180px,1.1fr) minmax(140px,.8fr);
  gap:14px;
  align-items:center;
}
.track-summary .track-title{
  min-width:0;
  font-size:15px;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.track-artist{
  min-width:0;
  color:var(--muted);
  font-size:13px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.track-summary .track-duration{
  display:block!important;
  text-align:right;
  font-weight:800;
  font-size:13px;
  color:#48566d;
  font-variant-numeric:tabular-nums;
}
.track-summary .delete-track-btn{
  width:34px;
  height:34px;
  justify-self:end;
}
.track-chevron{
  justify-self:center;
  color:#7b8799;
  font-size:20px;
  line-height:1;
  transition:transform .18s ease;
}
.track.compact-track.is-open .track-chevron{
  transform:rotate(180deg);
}

/* aufgeklappte Detailansicht */
.track-details{
  border-top:1px solid #e8edf5;
  background:#fbfcff;
  padding:13px 14px 14px;
}
.track-details[hidden]{display:none!important}
.track-detail-info{
  display:grid;
  grid-template-columns:minmax(150px,1fr) 90px minmax(180px,1.2fr) 90px;
  gap:12px;
  margin-bottom:12px;
}
.track-detail-info>div,
.track-detail-info>label{
  min-width:0;
  padding:8px 10px;
  background:#fff;
  border:1px solid #e3e8f1;
  border-radius:9px;
}
.track-detail-info>label{
  display:block;
}
.detail-label{
  display:block;
  margin-bottom:3px;
  color:#7a8699;
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.track-detail-info strong{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
}
.track-detail-info .edit-input{
  margin-top:2px;
  padding:8px 9px;
  font-size:13px;
}
.track-detail-controls{
  display:grid;
  grid-template-columns:auto minmax(120px,auto) minmax(130px,1fr) minmax(140px,1fr) 90px auto auto;
  gap:10px;
  align-items:end;
}
.track-detail-controls label,
.detail-rating{min-width:0}
.detail-rating .stars{height:36px;align-items:center}
.track-detail-controls select,
.track-detail-controls .edit-input{
  height:36px;
  padding:6px 8px;
}
.track-detail-controls .btn{
  height:36px;
  white-space:nowrap;
}
.detail-add-btn{
  width:auto!important;
  background:var(--soft)!important;
  color:var(--accent)!important;
}
.web-info-btn{
  width:auto;
  padding:7px 10px;
  font-size:12px;
}

/* Alte breite Track-Grid-Regeln in der neuen Ansicht neutralisieren */
.compact-track .track-main,
.compact-track .track-meta,
.compact-track .track-file,
.compact-track>.stars,
.compact-track>.track-dance,
.compact-track>.track-genre,
.compact-track>.track-bpm,
.compact-track>.add-btn{
  display:initial;
}

@media(max-width:1100px){
  .track-detail-info{
    grid-template-columns:1fr 90px 1fr;
  }
  .track-detail-info>div:last-child{display:none}
  .track-detail-controls{
    grid-template-columns:auto minmax(120px,auto) 1fr 1fr 80px;
  }
  .track-detail-controls .detail-add-btn,
  .track-detail-controls .web-info-btn{
    grid-row:2;
  }
}

@media(max-width:760px){
  .player{margin:10px 0}
  .track-summary{
    grid-template-columns:minmax(0,1fr) 58px 36px 20px;
    min-height:58px;
    padding:8px 7px 8px 10px;
    gap:6px;
  }
  .track-summary-main{
    grid-template-columns:1fr;
    gap:1px;
  }
  .track-summary .track-title{font-size:14px}
  .track-artist{font-size:11px}
  .track-summary .track-duration{font-size:12px}
  .track-summary .delete-track-btn{width:32px;height:32px}
  .track-detail-info{
    grid-template-columns:1fr 80px;
    gap:7px;
  }
  .track-detail-info>div:nth-child(3){
    grid-column:1/-1;
  }
  .track-detail-info>div:last-child{display:block}
  .track-detail-controls{
    grid-template-columns:1fr 1fr;
    align-items:end;
  }
  .track-detail-controls .play-detail-btn,
  .track-detail-controls .detail-add-btn,
  .track-detail-controls .web-info-btn{
    width:100%;
  }
  .detail-rating{grid-column:1/-1}
  .bpm-label{grid-column:1}
}

/* etwas mehr sichtbare Titel pro Bildschirm */
.track-list{gap:6px}


/* ===== 0.2.3: Player direkt zwischen Suche und Bibliothek ===== */
.toolbar + .player{
  margin-top:10px;
  margin-bottom:10px;
}
.player + .workspace{
  margin-top:0;
}


/* ===== 0.3.0 Analyse BPM / Tanz ===== */
.hero-actions{align-items:center}
.analysis-btn{
  background:#f3f6ff;
  border-color:#cad7fa;
  color:#214ea9;
}
.analysis-btn:hover{background:#e9efff}
.analysis-btn:disabled{opacity:.65;cursor:wait}
.analysis-quota{
  grid-column:1/-1;
  color:var(--muted);
  font-size:11px;
  text-align:right;
}
.analyze-one-btn{
  width:auto!important;
  background:#f3f6ff!important;
  color:#214ea9!important;
  border-color:#cad7fa!important;
}
.analysis-confidence{
  display:block;
  margin-top:2px;
  color:#7a8699;
  font-size:10px;
}
.analysis-badge{
  align-self:center;
  display:inline-flex;
  align-items:center;
  height:30px;
  padding:0 8px;
  border-radius:999px;
  background:#eef4ff;
  color:#36548c;
  font-size:10px;
  font-weight:750;
  white-space:nowrap;
}
@media(max-width:760px){
  .analysis-quota{text-align:left}
  .track-detail-controls .analyze-one-btn{width:100%!important}
  .analysis-badge{justify-self:start}
}



.year-edit .year-input{
  width:100%;
  min-width:0;
  height:34px;
  margin-top:2px;
  padding:6px 8px;
  font-size:13px;
}

.year-edit .year-input{
  display:block!important;
}

.footer-legal{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.footer-legal a{
  white-space:nowrap;
}

.playlist-manager{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto auto;
  gap:7px;
  align-items:center;
  margin:0 0 12px;
}
.playlist-manager select{
  min-width:0;
  padding:8px 9px;
}
.playlist-manager .btn{
  min-width:38px;
  padding:8px 10px;
}
@media(max-width:520px){
  .playlist-manager{
    grid-template-columns:1fr repeat(3,auto);
  }
  .playlist-actions .btn{
    flex:1 1 45%;
  }
}


/* ===== 0.5.2 Desktop: Player + Playlist gemeinsam rechts ===== */
.workspace{
  display:grid;
  grid-template-columns:minmax(0,1fr) 380px;
  gap:16px;
  align-items:start;
}

.right-column{
  display:flex;
  flex-direction:column;
  gap:16px;
}

@media (min-width:1121px){
  .right-column{
    position:sticky;
    top:93px;
    align-self:start;
  }

  .right-column .player,
  .right-column .playlist{
    width:100%;
    margin:0;
    position:static;
  }

  .right-column .player{
    grid-template-columns:1fr;
    gap:12px;
    align-items:stretch;
  }

  .right-column .player .player-hint,
  .right-column .player small{
    grid-column:1;
  }

  .right-column .player audio{
    min-width:0;
    width:100%;
  }
}

/* Schmale Ansicht wie bisher: Player oben, Bibliothek, danach Playlist */
@media (max-width:1120px){
  .workspace{
    grid-template-columns:1fr;
  }

  .right-column{
    display:contents;
  }

  .workspace > .library{
    order:2;
  }

  .right-column > .player{
    order:1;
  }

  .right-column > .playlist{
    order:3;
  }

  .right-column .playlist{
    position:static;
  }
}


/* ===== 0.5.3 gespeicherter Musikzugriff ===== */
.access-btn{
  border-color:#d7a43a;
  background:#fff8e8;
}
.access-btn:not([hidden]){
  display:inline-flex;
}
.access-info{
  flex-basis:100%;
  color:#667085;
  line-height:1.35;
}
.access-info.needs-access{
  color:#9a6700;
  font-weight:600;
}

.install-app-btn{
  border-color:#9bb7e8;
  background:#f3f7ff;
}
.install-app-btn:not([hidden]){
  display:inline-flex;
}

.local-folder-note{
  flex-basis:100%;
  display:block;
  color:#667085;
  line-height:1.35;
}


/* ===== 0.5.12 – separate Ordnerfreigaben wie im Video-Manager ===== */
.music-sources-panel{
  width:100%;
  margin-top:8px;
  border:1px solid #d9e0ea;
  border-radius:12px;
  background:#fbfcfe;
}
.music-sources-panel > summary{
  cursor:pointer;
  list-style:none;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  font-weight:700;
}
.music-sources-panel > summary::-webkit-details-marker{display:none}
.music-sources-panel > summary::after{
  content:"⌄";
  font-size:18px;
  transition:transform .15s ease;
}
.music-sources-panel[open] > summary::after{transform:rotate(180deg)}
.music-source-summary{
  margin-left:auto;
  font-size:12px;
  font-weight:600;
  color:#667085;
}
.music-source-summary.needs-access{color:#9a6700}
.music-source-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:0 10px 10px;
}
.music-source-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 11px;
  border:1px solid #e4e8ef;
  border-radius:10px;
  background:#fff;
  transition:box-shadow .2s ease,border-color .2s ease;
}
.music-source-row.ok{border-left:4px solid #5b9b68}
.music-source-row.warn{border-left:4px solid #d6a12c}
.music-source-row.bad{border-left:4px solid #b95d5d}
.music-source-row.needs-attention{
  border-color:#c88716;
  box-shadow:0 0 0 3px rgba(200,135,22,.16);
}
.music-source-main{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.music-source-main strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.music-source-main small{color:#667085}
.music-source-state{
  font-size:12px;
  font-weight:700;
}
.music-source-state.ok{color:#3b7c49}
.music-source-state.warn{color:#9a6700}
.music-source-state.bad{color:#a23c3c}
.music-source-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:6px;
}
@media (max-width:700px){
  .music-source-row{
    align-items:stretch;
    flex-direction:column;
  }
  .music-source-actions{
    justify-content:flex-start;
  }
}

#androidFolderHint{display:block;margin-top:6px;max-width:900px}
#androidFolderHint[hidden]{display:none}


/* v0.5.23: kompakte Hilfe für Android / iOS Netzordner */
.mobile-folder-help{
  margin-top:10px;
  border:1px solid #d6dee6;
  border-radius:10px;
  background:#f8fafc;
  overflow:hidden;
}
.mobile-folder-help > summary{
  cursor:pointer;
  padding:10px 12px;
  font-weight:700;
  user-select:none;
}
.mobile-folder-help[open] > summary{
  border-bottom:1px solid #dfe6ed;
  background:#f2f6fa;
}
.mobile-folder-help-body{
  padding:12px 14px 14px;
}
.mobile-folder-help-body h3{
  margin:8px 0 6px;
  font-size:1rem;
}
.mobile-folder-help-body h3:first-child{
  margin-top:0;
}
.mobile-folder-help-body ol{
  margin:6px 0 10px 1.35rem;
  padding:0;
}
.mobile-folder-help-body li{
  margin:4px 0;
}
.mobile-folder-help-body code{
  white-space:nowrap;
}


/* v0.5.24: Einzeldatei-Auswahl für ältere iPhones/iPads */
#iosFilesBtn{
  margin-top:8px;
}
#iosFilesHint{
  display:block;
  margin-top:6px;
}
#iosFilesHint[hidden]{
  display:none!important;
}


/* v0.5.28: aktuellen Titel direkt bewerten und in Bibliothek öffnen */
.player-current-title{
  cursor:pointer;
  text-decoration:none;
  border-radius:6px;
  outline:none;
}
.player-current-title:hover,
.player-current-title:focus-visible{
  text-decoration:underline;
}
.player-current-title:focus-visible{
  box-shadow:0 0 0 2px rgba(60,110,160,.25);
}

.player-rating{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:5px;
}
.player-rating[hidden]{
  display:none!important;
}
.player-rating-label{
  font-size:.78rem;
  opacity:.72;
}
.player-stars{
  display:flex;
  gap:1px;
}
.player-stars .star{
  padding:0 1px;
  min-width:auto;
  line-height:1;
  font-size:1.05rem;
}

.track.player-jump-highlight{
  animation:playerJumpHighlight 2.2s ease-out;
}
@keyframes playerJumpHighlight{
  0%{box-shadow:0 0 0 4px rgba(60,110,160,.32)}
  35%{box-shadow:0 0 0 4px rgba(60,110,160,.20)}
  100%{box-shadow:0 0 0 0 rgba(60,110,160,0)}
}

.player-power-option{grid-column:1/-1;display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;user-select:none}.player-power-option input{width:18px;height:18px;accent-color:var(--accent)}.player-power-option[hidden]{display:none!important}

/* v1.0: Analyse + MP3-Tag-Schreiben */
.analysis-actions{display:flex;gap:.65rem;flex-wrap:wrap;align-items:center}
.tag-write-btn{white-space:nowrap}
@media(max-width:640px){.analysis-actions>.btn{flex:1 1 100%}}


/* v1.0: sichtbare Rückmeldung beim MP3-Tag-Schreiben */
.tag-write-btn[hidden]{display:none!important}
.tag-write-report{margin-top:.65rem;padding:.65rem .8rem;border:1px solid var(--border);border-radius:10px;background:var(--panel);font-size:.88rem;line-height:1.45;white-space:pre-line}
.tag-write-report[hidden]{display:none!important}
.tag-write-report.success{border-color:rgba(40,167,69,.45)}
.tag-write-report.warning{border-color:rgba(255,193,7,.55)}
.tag-write-report.error{border-color:rgba(220,53,69,.55)}

/* Hoffmann-Software Musik-Manager 1.5.31 – Werbefrei-/Werbeblocker-Dialog */
footer a#vmSupportFooterLink {font-weight:700;text-underline-offset:3px}
.vm-support-dialog {width:min(96vw,560px);max-height:min(88vh,720px);padding:0;border:1px solid #d2dfec;border-radius:19px;color:#172b4d;background:#fff;box-shadow:0 28px 80px rgba(13,35,66,.28);overflow:auto}
.vm-support-dialog::backdrop {background:rgba(15,31,50,.62);backdrop-filter:blur(2px)}
.vm-support-inner {position:relative;padding:28px 30px 22px}
.vm-support-x {position:absolute;right:14px;top:12px;background:#edf2f8;border:0;border-radius:50%;font-size:25px;line-height:1;width:35px;height:35px;cursor:pointer;color:#263b54}
.vm-support-x:hover {background:#dce8f2}
.vm-support-badge {font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#206797;padding-right:48px}
.vm-support-dialog h2 {margin:9px 0 11px;font-size:clamp(22px,4vw,28px);line-height:1.2;color:#173c62}
.vm-support-dialog p {font-size:15px;line-height:1.55;margin:10px 0}
.vm-support-instructions {margin:17px 0;padding:15px 16px;border-radius:12px;background:#eef7fc;border:1px solid #d8e8f4}
.vm-support-instructions strong {display:block;font-size:15px;color:#19486a}
.vm-support-instructions p {margin:8px 0 0;font-size:14px}
.vm-support-actions {display:grid;gap:10px;margin-top:17px}
.vm-support-actions .btn {min-height:44px;white-space:normal;line-height:1.3}
.vm-support-pending {padding:11px 13px;border:1px solid #e3d7bd;background:#fff8eb;border-radius:9px;font-size:13px!important;color:#654e20}
.vm-support-offline {font-size:13px!important;color:#526679;text-align:center}
.vm-support-bottom {display:flex;justify-content:flex-end;margin-top:14px;border-top:1px solid #e6edf2;padding-top:13px}
.vm-support-bottom .btn {padding:8px 15px}
.vm-support-dialog [hidden] {display:none!important}
@media(max-width:600px){.vm-support-inner{padding:24px 18px 16px}.vm-support-dialog{max-height:92vh}.vm-support-dialog h2{font-size:22px}}


/* Gemeinsame Dialogdetails direkt aus dem Video-Manager */
.vm-privacy-x {position:absolute;right:12px;top:12px;border:0;border-radius:50%;background:#ecf0f5;width:36px;height:36px;font-size:24px;color:#334a60}
.vm-privacy-kicker {color:#2457d6;font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:12px;margin:0 42px 8px 0}

/* Musik-Manager v1.5.35: passwortfreie MUSIK-Registrierung */
.vm-license-dialog{border:0;border-radius:18px;box-shadow:0 20px 70px rgba(0,0,0,.25);width:min(94vw,670px);max-height:88vh;padding:0;color:#13223c;background:#fff}
.vm-license-dialog::backdrop{background:rgba(13,24,41,.65)}
.vm-license-inner{position:relative;padding:26px;display:grid;gap:14px}
.vm-license-inner h2,.vm-license-inner p{margin:0}
.vm-license-inner form{display:grid;gap:8px}
.vm-license-inputrow{display:flex;flex-wrap:wrap;gap:9px}
.vm-license-inputrow input{flex:1;min-width:220px;padding:11px 13px;border:1px solid #8c9cb1;border-radius:9px;font:inherit}
.vm-license-status{background:#f0f4fa;border-radius:9px;padding:12px;color:#15345c}
.vm-license-status.error{background:#fff0ed;color:#a32310}
.vm-license-controls,.vm-license-bottom{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.vm-license-bottom{justify-content:flex-end}
.vm-license-note{font-size:.87rem;color:#56667a}
.vm-license-badge{display:inline-block;border-radius:15px;padding:2px 8px;background:#e4f7eb;color:#0e6b33;font-weight:650}

.vm-license-dialog [hidden],.vm-license-badge[hidden]{display:none!important}
