/* The personal header uses the same paper, typography and spacing as the profile. */
[data-personal-musician].repertoire-artist-locked { --rep-header-height: 0px; }
.personal-header .personal-header__inner { display: grid; grid-template-columns: minmax(160px, 1fr) auto minmax(160px, 1fr); gap: var(--ui-space-16); padding-top: var(--ui-space-8); padding-bottom: var(--ui-space-8); }
.personal-header__identity { display: grid; min-width: 0; line-height: var(--ui-line-height-1-25); }
.personal-header__identity strong { font: var(--ui-type-personal-header-name); }
.personal-header__identity span { color: var(--ui-color-muted); font: var(--ui-type-personal-header-category); }
.personal-header__menu { display: flex; align-items: center; gap: var(--ui-space-16); white-space: nowrap; font: var(--ui-type-control-small); }
.personal-header__menu a { display: inline-flex; align-items: center; min-height: 44px; }
.personal-header__contacts { display: flex; align-items: center; justify-content: flex-end; gap: var(--ui-space-8); }
.personal-header__phone { white-space: nowrap; font: var(--ui-type-control-small); }
.personal-header__social { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex-shrink: 0; }
.personal-header__social img { width: 26px; height: 26px; }
.personal-header a:hover, .personal-header a:focus-visible { color: var(--ui-color-accent); }
.personal-header__menu a:focus-visible, .personal-header__identity:focus-visible, .personal-header__phone:focus-visible { text-decoration: underline; }
[data-personal-musician] #artist-about,
[data-personal-musician] #artist-gallery,
[data-personal-musician] #artist-videos,
[data-personal-musician] #artist-repertoire,
[data-personal-musician] #personalFooter { scroll-margin-top: calc(var(--personal-header-height, 76px) + var(--ui-space-16)); }

.personal-header__menu a { position: relative; }
.personal-header__menu a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 7px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .2s ease; }
.personal-header__menu a:hover::after, .personal-header__menu a:focus-visible::after { transform: scaleX(1); transform-origin: left; }
.personal-menu-toggle { position: relative; display: none; width: 44px; height: 44px; border: 0; background: transparent; cursor: pointer; justify-self: end; align-items: center; justify-content: center; }
.personal-menu-toggle span { position: absolute; width: 22px; height: 1px; background: var(--ui-color-ink); }
.personal-menu-toggle span:first-child { transform: translateY(-4px); }
.personal-menu-toggle span:last-child { transform: translateY(4px); }
.personal-menu-toggle[aria-expanded="true"] span:first-child { transform: rotate(45deg); }
.personal-menu-toggle[aria-expanded="true"] span:last-child { transform: rotate(-45deg); }
.personal-menu { position: fixed; inset: 0 0 auto; margin: 0; width: 100%; max-width: none; max-height: 100vh; max-height: 100dvh; padding: 0 0 var(--ui-space-24); overflow-y: auto; color: var(--ui-color-ink); border: 0; border-bottom: 1px solid var(--ui-color-line); border-radius: 0; background: var(--ui-color-paper); background-image: var(--ui-texture-paper); }
.personal-menu::backdrop { background: var(--ui-paint-2d55e9cc1b); }
.personal-menu-open { overflow: hidden; }
.personal-menu__top { display: flex; align-items: center; justify-content: space-between; min-height: 64px; gap: var(--ui-space-16); }
#personalMenu .personal-menu-close { display: flex; border: 0; background: transparent; --pi-line: transparent; --pi-hover: transparent; }
.personal-menu__body { padding-top: 0; }
.personal-menu__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--ui-space-24); padding-top: var(--ui-space-2); border-top: 1px solid var(--ui-color-line); }
.personal-menu__links a { display: flex; min-height: 46px; align-items: center; text-underline-offset: 5px; font: var(--ui-type-personal-menu-link); }
.personal-menu__links a:hover, .personal-menu__links a:focus-visible { color: var(--ui-color-accent); text-decoration: underline; }
.personal-menu__contacts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ui-space-4); margin-top: var(--ui-space-16); }
.personal-menu__contacts a:last-child:nth-child(odd) { grid-column: 1 / -1; }
.personal-menu__contacts a { display: grid; min-width: 0; height: var(--ui-personal-contact-height); min-height: var(--ui-personal-contact-height); grid-template-columns: var(--ui-space-24) minmax(0,1fr); align-items: center; gap: var(--ui-personal-contact-gap); padding: 0 var(--ui-space-12); background: var(--ui-color-surface); border: 1px solid var(--ui-color-line); border-radius: var(--ui-radius-control); }
.personal-menu__contacts strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: var(--ui-type-personal-menu-contact); }
.personal-menu__contacts a:hover, .personal-menu__contacts a:focus-visible { color: var(--ui-color-white); background: var(--ui-color-accent); border-color: var(--ui-color-accent); }
@media (max-width: 1250px) {
  .personal-header .personal-header__inner { grid-template-columns: minmax(0, 1fr) auto; min-height: 64px; gap: var(--ui-space-16); }
  .personal-header__menu, .personal-header__contacts { display: none; }
  .personal-menu-toggle { display: flex; }
}
@media (prefers-reduced-motion: reduce) { .personal-header__menu a::after { transition: none; } }

/* Artist-owned contact section replaces the copyright footer. */
#personalCalculator { min-height: 510px; scroll-margin-top: 90px; }
@media (max-width: 800px) { #personalCalculator { min-height: 900px; } }
.personal-contact { color: var(--ui-color-white); padding-bottom: var(--ui-space-48); }
.personal-contact[hidden] { display: none; }
.personal-contact__panel { padding: var(--ui-space-24); background: var(--ui-color-accent); border-radius: var(--ui-radius-card); }
.personal-contact__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ui-space-4); }
.personal-contact__links a { display: grid; min-width: 0; height: var(--ui-personal-contact-height); min-height: var(--ui-personal-contact-height); grid-template-columns: var(--ui-space-24) minmax(0,1fr); align-items: center; gap: var(--ui-personal-contact-gap); padding: 0 var(--ui-space-12); background: var(--ui-paint-1ef7f93156); border: 1px solid var(--ui-paint-e56afd83c3); border-radius: var(--ui-radius-control); }
.personal-contact__links a:last-child:nth-child(odd) { grid-column: 1 / -1; }
.personal-contact__links strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ui-paint-3283c5139c); font: var(--ui-type-personal-contact); }
.personal-contact__links a:hover, .personal-contact__links a:focus-visible { background: var(--ui-paint-5eb6df96b6); border-color: var(--ui-paint-5003976993); }
@media (max-width: 800px) {
  .personal-contact { padding-bottom: var(--ui-space-32); }
  .personal-contact__panel { padding: var(--ui-space-16); }
  .personal-contact__links, .personal-menu__contacts { grid-template-columns: minmax(0,1fr); }
}

.personal-contact__links a > img, .personal-menu__contacts a > img { width: var(--ui-space-24); height: var(--ui-space-24); filter: none;}

.ad-profile__copy > p {font: var(--ui-type-personal-summary);}

.personal-contact__links a > img:is([src$="/phone.svg"],[src$="/mail.svg"]) {filter: brightness(0) invert(1);}

/* Named personal-page roles; catalog profiles retain their own standard. */
[data-personal-musician] .ad-profile__identity h1 { font: var(--ui-type-personal-name); margin-top: var(--ui-space-8); }
[data-personal-musician] .ad-summary__category { font: var(--ui-type-personal-category); }
[data-personal-musician] .ad-profile__actions { margin-top: var(--ui-space-16); }
[data-personal-musician] .ad-profile__actions .ad-button { height: var(--ui-personal-action-height); min-height: var(--ui-personal-action-height); }
[data-personal-musician] .ad-tags > span { font: var(--ui-type-personal-tag); }
[data-personal-musician] #artist-repertoire h2 { font: var(--ui-type-personal-name); }
[data-personal-musician] .ad-video-card figcaption { font: var(--ui-type-personal-caption); }
[data-personal-musician] .rep-artist-identity { display: flex; flex-direction: column; gap: var(--ui-space-4); }
[data-personal-musician] .rep-artist-identity h1 { font: var(--ui-type-personal-repertoire-name); }
[data-personal-musician] .rep-artist-category { margin: 0; font: var(--ui-type-personal-repertoire-category); }
[data-personal-musician] .vr-search-field, [data-personal-musician] .vr-search-field input { height: var(--ui-personal-action-height); min-height: var(--ui-personal-action-height); }
[data-personal-musician] :is(.vr-actions .rep-button,.vr-pagination-top .rep-button,.vr-toolbar-button) { height: var(--ui-personal-action-height); min-height: var(--ui-personal-action-height); }
[data-personal-musician] .vr-song__choice :is(svg,[data-vocava-icon]), [data-personal-musician] .vr-toolbar-button :is(svg,[data-vocava-icon]) { width: var(--ui-personal-choice-icon-size); height: var(--ui-personal-choice-icon-size); }
@media (max-width: 800px) {
  [data-personal-musician] .ad-gallery__thumbs { grid-auto-columns: calc((100% - 3 * var(--ui-space-8)) / 3.5); }
  [data-personal-musician] .vr-favorites-toggle,
  [data-personal-musician] .vr-stop-toggle,
  [data-personal-musician] .vr-sort__icon { width: var(--ui-space-44); }
  [data-personal-musician] .vr-summary { display: none; }
}

/* Paging and sorting stay adjacent on the trailing edge, also when wrapped. */
[data-personal-musician] .vr-toolbar { flex-wrap: wrap; }
[data-personal-musician] .vr-toolbar__sorting { display: flex; align-items: center; gap: var(--ui-control-gap); margin-left: auto; }
[data-personal-musician] .vr-toolbar__sorting > :is(.vr-sort,.vr-pagination-top) { margin: 0; }
[data-personal-musician] .vr-search-field input { font: var(--ui-type-personal-search); }
[data-personal-musician] .vr-filter__group-title, [data-personal-musician] #vrFilterMenu > .vr-popover__head { box-sizing: border-box; height: var(--ui-personal-action-height); min-height: var(--ui-personal-action-height); padding-block: 0; }
[data-personal-musician] #vrFilterMenu > .vr-popover__head strong { font: var(--ui-type-control); }
[data-personal-musician] #vrFilterReset { font: var(--ui-type-personal-filter-reset); }

[data-personal-musician] .personal-contact__links a { height: var(--ui-personal-footer-contact-height); min-height: var(--ui-personal-footer-contact-height); }
[data-personal-musician] .vr-pagination .rep-button { height: var(--ui-personal-action-height); min-height: var(--ui-personal-action-height); }
[data-personal-musician] .vr-pagination-top .rep-button { border: 0; background: transparent; --pb-background: transparent; --pb-hover-background: transparent; }
[data-personal-musician] .vr-pagination { display: flex; flex-direction: column; align-items: center; }
[data-personal-musician] .vr-pagination > button[data-song-more] { order: -1; }
[data-personal-musician] .vr-sort__menu button, [data-personal-musician] .vr-filter__option, [data-personal-musician] .vr-filter__group-title { border-radius: 0; }
[data-personal-musician] .vr-song[data-choice="like"] { background: var(--rep-like-soft); border-color: var(--rep-like); }
[data-personal-musician] .vr-song[data-choice="stop"] { background: var(--rep-stop-soft); border-color: var(--rep-stop); }
[data-personal-musician] .vr-song.is-choosing { animation: personal-song-choice var(--ui-motion-duration-fast) var(--ui-ease); }
@keyframes personal-song-choice { 50% { transform: scale(var(--ui-motion-press)); } }
@media (prefers-reduced-motion: reduce) { [data-personal-musician] .vr-song.is-choosing { animation: none; } }


/* Personal menu, song preview and PDF selection roles. */
.personal-menu__links a[hidden], .personal-header__menu a[hidden] { display: none; }
.personal-menu__contacts a:is(:hover,:focus-visible,:active) > img:is([src$="/phone.svg"],[src$="/mail.svg"]) { filter: brightness(0) invert(1); }
[data-personal-musician] .vr-filter__option b { font: var(--ui-type-personal-filter-count); }
[data-personal-musician] .vr-empty-actions { flex-direction: column; gap: var(--ui-space-8); }
[data-personal-musician] .vr-empty-icon { width: var(--ui-space-32); height: var(--ui-space-32); }
[data-personal-musician] .vr-song { height: var(--ui-personal-song-height); min-height: var(--ui-personal-song-height); padding: var(--ui-space-8); border-width: var(--ui-personal-song-border-width); grid-template-columns: var(--ui-personal-song-cover-size) minmax(0,1fr) auto; contain-intrinsic-size: var(--ui-personal-song-height); }
[data-personal-musician] .vr-song:not(:has(.vr-song-cover)) { grid-template-columns: minmax(0,1fr) auto; }
[data-personal-musician] .vr-song-cover { width: var(--ui-personal-song-cover-size); height: var(--ui-personal-song-cover-size); }
[data-personal-musician] .vr-song__title h3 { font: var(--ui-type-personal-song-title); }
[data-personal-musician] .vr-song-cover__play img { width: var(--ui-space-24); height: var(--ui-space-24); }
[data-personal-musician] .vr-song:has(.vr-song__seek) { height: auto; }
[data-personal-musician] .vr-song__seek { grid-column: 1 / -1; width: 100%; height: var(--ui-space-32); min-width: 0; margin: 0; padding: 0; accent-color: var(--ui-color-accent); cursor: pointer; }
[data-personal-musician] .vr-pdf-options { --ui-pdf-option-height: var(--ui-space-72); }
[data-personal-musician] .vr-pdf-options__head h2 { font: var(--ui-type-personal-name); }
[data-personal-musician] .vr-pdf-options__head > span { margin-top: var(--ui-space-4); }
[data-personal-musician] .vr-pdf-options__list { margin-top: var(--ui-space-16); }
[data-personal-musician] .vr-pdf-option { gap: var(--ui-space-11); }
[data-personal-musician] .vr-pdf-option__copy strong { font: var(--ui-type-personal-menu-link); }
[data-personal-musician] .vr-pdf-options__actions { --public-button-height: var(--ui-space-44); position: static; bottom: auto; padding: 0; margin-top: var(--ui-space-16); background: transparent; }
[data-personal-musician] .vr-pdf-options__actions .rep-button { height: var(--ui-space-44); min-height: var(--ui-space-44); }
@media (max-width: 800px) {
 [data-personal-musician] .vr-toolbar > .vr-filter { flex: 0 0 var(--ui-space-44); min-width: 0; }
 [data-personal-musician] .vr-filter > .vr-toolbar-button { width: var(--ui-space-44); }
 [data-personal-musician] .vr-filter > .vr-toolbar-button span { display: none; }
 [data-personal-musician] .vr-song-cover__play { opacity: .75; }
}
@media (hover: none) { [data-personal-musician] .vr-song-cover__play { opacity: .75; } }
