/* Only Offline row 2. Existing row 1 and player geometry stay in style.css. */
#profileAccount.profile-subpage-open #profileOfflinePanel .profile-likes-head#offlineToolbar{
 display:block !important;position:relative;min-height:34px !important;height:34px;padding:0 !important;direction:rtl !important;
}
#offlineToolbar [hidden]{display:none !important}
#offlineToolbarMain,#offlineSearchBox{display:flex;align-items:center;gap:4px;height:34px;min-width:0;direction:rtl}
#offlineToolbar button,#offlineToolbar input,#offlineToolbar select{font:inherit;color:inherit}
#offlineToolbar button{border:0;background:transparent;cursor:pointer;touch-action:manipulation}
#offlineToolbar #offlineChannelButton{display:flex;align-items:center;gap:5px;min-width:0;max-width:100%;height:34px;padding:0 2px;flex:1;text-align:right;font-weight:800}
#offlineChannelLabel{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#profileAccount.profile-subpage-open #offlineToolbar #profileOfflineCount{display:inline-block !important;direction:rtl !important;flex:none;white-space:nowrap;font-size:11px !important;opacity:.7;margin:0 4px !important;width:auto !important}
#offlineToolbar .offline-tool-icon{display:flex;align-items:center;justify-content:center;width:34px;height:34px;padding:6px;flex:none;border-radius:8px}
#offlineToolbar svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#offlineToolbar button:focus-visible,#offlineToolbar input:focus-visible{outline:2px solid #c8b9ee;outline-offset:1px}
#offlineSearch{min-width:0;flex:1;width:100%;height:32px;box-sizing:border-box;border:1px solid #7775;border-radius:8px;background:transparent;padding:0 8px;direction:rtl;font-size:14px !important}
#offlineOptions{position:absolute;top:38px;right:0;left:0;z-index:20;box-sizing:border-box;padding:10px;border:1px solid #7777;border-radius:12px;background:#23242b;color:#f4f4f7;box-shadow:0 8px 24px #0008;max-height: min(50vh,320px);overflow:auto;direction:rtl}
#offlineOptionsClose{display:block;margin-inline-start:auto;font-size:12px !important;min-height:32px}
#offlineChannelPicker button{display:block;width:100%;text-align:right;padding:9px !important;min-height:40px;border-radius:8px}
#offlineChannelPicker button[aria-pressed=true]{background:#ffffff18}
#offlineSortOptions label{display:flex;gap:8px;align-items:center;font-size:13px}
#offlineSort{min-width:0;flex:1;background:#30313a;border:1px solid #7775;border-radius:6px;padding:8px}
#offlineUsage{display:block;font-size:12px;opacity:.7;margin:10px 0 4px}
.offline-show-more{display:block;width:100%;min-height:42px;border:1px solid #7775;border-radius:10px;background:transparent;color:inherit;font:inherit;font-size:13px;margin:8px 0;cursor:pointer}
.profile-offline-channels{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block;font-size:10px;opacity:.6;margin-top:2px;line-height:1.3}
body.light-theme #offlineOptions{background:#f4f4f7;color:#222}
body.light-theme #offlineSort{background:#fff;color:#222}

/* V1.1: lift the whole header above the scroll container. Its transformed
   row forms a stacking context; z-index on the popup alone cannot escape it. */
#profileAccount.profile-subpage-open #profileOfflinePanel > .profile-subpage-header{
 position:relative;z-index:30;overflow:visible;
}
#profileAccount.profile-subpage-open #profileOfflinePanel #offlineToolbar{
 z-index:2;overflow:visible;
}
#profileAccount.profile-subpage-open #profileOfflinePanel > #profileOfflineList{
 position:relative;z-index:0;
}

/* V1.2: physical LEFT count column / RIGHT channel name; isolate mixed scripts. */
#offlineChannelPicker button,#offlineChannelPicker .offline-channel-columns{
 display:grid;grid-template-columns:64px minmax(0,1fr);align-items:center;
 column-gap:12px;direction:ltr;box-sizing:border-box;
}
#offlineChannelPicker .offline-channel-columns{
 padding:4px 9px 8px;font-size:11px;opacity:.65;border-bottom:1px solid #8883;margin-bottom:4px;
}
#offlineChannelPicker .offline-channel-name{
 grid-column:2;grid-row:1;min-width:0;text-align:right;unicode-bidi:isolate;
 overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
#offlineChannelPicker .offline-channel-count{
 grid-column:1;grid-row:1;text-align:center;unicode-bidi:isolate;direction:ltr;
 font-family:inherit;font-variant-numeric:tabular-nums;white-space:nowrap;
}
#offlineChannelPicker button .offline-channel-count{
 justify-self:stretch;border-radius:6px;background:#8882;padding:3px 4px;
}

/* Likes uses the same compact controls, with independent element IDs. */
/* Only Offline row 2. Existing row 1 and player geometry stay in style.css. */
#profileAccount.profile-subpage-open #profileLikesPanel .profile-likes-head#likesToolbar{
 display:block !important;position:relative;min-height:34px !important;height:34px;padding:0 !important;direction:rtl !important;
}
#likesToolbar [hidden]{display:none !important}
#likesToolbarMain,#likesSearchBox{display:flex;align-items:center;gap:4px;height:34px;min-width:0;direction:rtl}
#likesToolbar button,#likesToolbar input,#likesToolbar select{font:inherit;color:inherit}
#likesToolbar button{border:0;background:transparent;cursor:pointer;touch-action:manipulation}
#likesToolbar #likesChannelButton{display:flex;align-items:center;gap:5px;min-width:0;max-width:100%;height:34px;padding:0 2px;flex:1;text-align:right;font-weight:800}
#likesChannelLabel{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#profileAccount.profile-subpage-open #likesToolbar #profileLikesCount{display:inline-block !important;direction:rtl !important;flex:none;white-space:nowrap;font-size:11px !important;opacity:.7;margin:0 4px !important;width:auto !important}
#likesToolbar .offline-tool-icon{display:flex;align-items:center;justify-content:center;width:34px;height:34px;padding:6px;flex:none;border-radius:8px}
#likesToolbar svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#likesToolbar button:focus-visible,#likesToolbar input:focus-visible{outline:2px solid #c8b9ee;outline-offset:1px}
#likesSearch{min-width:0;flex:1;width:100%;height:32px;box-sizing:border-box;border:1px solid #7775;border-radius:8px;background:transparent;padding:0 8px;direction:rtl;font-size:14px !important}
#likesOptions{position:absolute;top:38px;right:0;left:0;z-index:20;box-sizing:border-box;padding:10px;border:1px solid #7777;border-radius:12px;background:#23242b;color:#f4f4f7;box-shadow:0 8px 24px #0008;max-height: min(50vh,320px);overflow:auto;direction:rtl}
#likesOptionsClose{display:block;margin-inline-start:auto;font-size:12px !important;min-height:32px}
#likesChannelPicker button{display:block;width:100%;text-align:right;padding:9px !important;min-height:40px;border-radius:8px}
#likesChannelPicker button[aria-pressed=true]{background:#ffffff18}
#likesSortOptions label{display:flex;gap:8px;align-items:center;font-size:13px}
#likesSort{min-width:0;flex:1;background:#30313a;border:1px solid #7775;border-radius:6px;padding:8px}
#likesUsage{display:block;font-size:12px;opacity:.7;margin:10px 0 4px}
.offline-show-more{display:block;width:100%;min-height:42px;border:1px solid #7775;border-radius:10px;background:transparent;color:inherit;font:inherit;font-size:13px;margin:8px 0;cursor:pointer}
.profile-offline-channels{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block;font-size:10px;opacity:.6;margin-top:2px;line-height:1.3}
body.light-theme #likesOptions{background:#f4f4f7;color:#222}
body.light-theme #likesSort{background:#fff;color:#222}

/* V1.1: lift the whole header above the scroll container. Its transformed
   row forms a stacking context; z-index on the popup alone cannot escape it. */
#profileAccount.profile-subpage-open #profileLikesPanel > .profile-subpage-header{
 position:relative;z-index:30;overflow:visible;
}
#profileAccount.profile-subpage-open #profileLikesPanel #likesToolbar{
 z-index:2;overflow:visible;
}
#profileAccount.profile-subpage-open #profileLikesPanel > #profileLikesList{
 position:relative;z-index:0;
}

/* V1.2: physical LEFT count column / RIGHT channel name; isolate mixed scripts. */
#likesChannelPicker button,#likesChannelPicker .offline-channel-columns{
 display:grid;grid-template-columns:64px minmax(0,1fr);align-items:center;
 column-gap:12px;direction:ltr;box-sizing:border-box;
}
#likesChannelPicker .offline-channel-columns{
 padding:4px 9px 8px;font-size:11px;opacity:.65;border-bottom:1px solid #8883;margin-bottom:4px;
}
#likesChannelPicker .offline-channel-name{
 grid-column:2;grid-row:1;min-width:0;text-align:right;unicode-bidi:isolate;
 overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
#likesChannelPicker .offline-channel-count{
 grid-column:1;grid-row:1;text-align:center;unicode-bidi:isolate;direction:ltr;
 font-family:inherit;font-variant-numeric:tabular-nums;white-space:nowrap;
}
#likesChannelPicker button .offline-channel-count{
 justify-self:stretch;border-radius:6px;background:#8882;padding:3px 4px;
}

/* Shared noninteractive title tab, anchored to the existing card border. */
#profileModal .profile-card > #profileLibraryTitle{
 position:absolute;top:-1px;left:50%;transform:translateX(-50%);z-index:35;
 width:132px;height:30px;box-sizing:border-box;padding:5px 4px 6px;margin:0;
 display:flex;align-items:center;justify-content:center;white-space:nowrap;
 border:1px solid rgba(255,255,255,.2);border-top:0;border-radius:0 0 14px 14px;
 background:#1d1e25;color:#ededf3;
 font-family:inherit;font-size:12px;font-weight:600;line-height:1.2;
 pointer-events:none;direction:rtl;
}
#profileModal .profile-card > #profileLibraryTitle[hidden]{display:none !important}
body.light-theme #profileModal .profile-card > #profileLibraryTitle{
 background:#f1f1f5;color:#252532;border-color:rgba(22,25,35,.2);
}
@media(max-width:420px){
 #profileModal .profile-card > #profileLibraryTitle{width:124px;font-size:11.5px;height:28px}
 #profileModal .profile-card.profile-library-open:has(#profileAccount.profile-subpage-open) > #profileClose,
 #profileModal .profile-card.profile-library-open #profileAccount.profile-subpage-open .profile-subpage-actions .profile-likes-back{
  width:90px !important;min-width:90px !important;max-width:90px !important;
  font-size:11.5px !important;padding:0 5px !important;
 }
}
@media(max-width:350px){
 #profileModal .profile-card > #profileLibraryTitle{width:106px;font-size:11px;height:26px}
 #profileModal .profile-card.profile-library-open:has(#profileAccount.profile-subpage-open) > #profileClose,
 #profileModal .profile-card.profile-library-open #profileAccount.profile-subpage-open .profile-subpage-actions .profile-likes-back{
  width:76px !important;min-width:76px !important;max-width:76px !important;
  font-size:10.5px !important;padding:0 3px !important;
 }
}

/* V1.4: compact plaque, with room on each side and natural two-line titles. */
#profileModal .profile-card > #profileLibraryTitle{
 width:88px;height:auto;min-height:30px;max-height:44px;
 padding:5px 6px 6px;white-space:normal;text-align:center;
 line-height:1.35;word-break:normal;overflow-wrap:normal;
 border-bottom-left-radius:12px;border-bottom-right-radius:12px;
}
@media(max-width:350px){
 #profileModal .profile-card > #profileLibraryTitle{
  width:78px;min-height:28px;padding:4px 5px 5px;
 }
}

/* V1.5: one shared coordinate system for navigation, independent of page transforms. */
#profileModal .profile-card.profile-library-open{
 --library-nav-width:96px;--library-title-width:124px;--library-title-font:12px;
}
#profileModal .profile-card > .profile-library-back[hidden]{display:none !important}
#profileModal .profile-card > .profile-library-back,
#profileModal .profile-card.profile-library-open:has(#profileAccount.profile-subpage-open) > #profileClose{
 position:absolute !important;top:16px !important;bottom:auto !important;
 width:var(--library-nav-width) !important;min-width:var(--library-nav-width) !important;max-width:var(--library-nav-width) !important;
 height:36px !important;min-height:36px !important;max-height:36px !important;
 transform:none !important;margin:0 !important;padding:0 6px !important;box-sizing:border-box;
 display:inline-flex !important;align-items:center !important;justify-content:center !important;
 gap:6px !important;white-space:nowrap;line-height:1 !important;
 font-family:inherit;font-size:12px !important;font-weight:700 !important;
 border:1px solid rgba(255,255,255,.14);border-radius:10px !important;
 background:rgba(255,255,255,.055);color:inherit;cursor:pointer;z-index:40 !important;
}
#profileModal .profile-card > .profile-library-back{
 left:13px !important;right:auto !important;direction:ltr !important;
}
#profileModal .profile-card.profile-library-open:has(#profileAccount.profile-subpage-open) > #profileClose{
 right:13px !important;left:auto !important;direction:rtl !important;
}
#profileModal .profile-card > .profile-library-back::before,
#profileModal .profile-card > .profile-library-back::after{content:none !important;display:none !important}
#profileModal .profile-card > .profile-library-back svg{
 width:15px;height:15px;flex:0 0 15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;
}
#profileModal .profile-card.profile-library-open:has(#profileAccount.profile-subpage-open) > #profileClose .profile-radio-return-icon{
 position:static !important;transform:none !important;margin:0 !important;
 display:inline-flex !important;align-items:center;justify-content:center;
 width:14px !important;height:14px !important;flex:0 0 14px !important;
 box-sizing:border-box;font-size:7px !important;line-height:1 !important;
}
#profileModal .profile-card.profile-library-open:has(#profileAccount.profile-subpage-open) > #profileClose .profile-radio-return-label{
 position:static !important;transform:none !important;margin:0 !important;padding:0 !important;
 font-size:inherit !important;line-height:1 !important;white-space:nowrap;
}
#profileModal .profile-card.profile-library-open > #profileLibraryTitle{
 width:min(var(--library-title-width),calc(100% - var(--library-nav-width) - var(--library-nav-width) - 42px));
 min-height:28px;height:28px;max-height:28px;padding:5px 4px 6px;
 white-space:nowrap;line-height:1.2;font-size:var(--library-title-font);
}
body.light-theme #profileModal .profile-card > .profile-library-back{
 border-color:rgba(22,25,35,.14);background:rgba(22,25,35,.045);color:inherit;
}
@media(max-width:420px){
 #profileModal .profile-card.profile-library-open{--library-nav-width:92px;--library-title-width:116px;--library-title-font:11px}
 #profileModal .profile-card > .profile-library-back,
 #profileModal .profile-card.profile-library-open:has(#profileAccount.profile-subpage-open) > #profileClose{font-size:11.5px !important;padding:0 5px !important}
}
@media(max-width:350px){
 #profileModal .profile-card.profile-library-open{--library-nav-width:76px;--library-title-width:104px;--library-title-font:9px}
 #profileModal .profile-card > .profile-library-back,
 #profileModal .profile-card.profile-library-open:has(#profileAccount.profile-subpage-open) > #profileClose{font-size:10.5px !important;padding:0 3px !important;gap:4px !important}
}

/* V1.6: direct sort choices, compact popup anchored to the Sort icon. */
#offlineOptions.is-sort,#likesOptions.is-sort{
 width:220px;max-width:100%;left:0;right:auto;padding:6px;
}
#offlineToolbar #offlineSort,#likesToolbar #likesSort{
 display:grid;gap:3px;padding:0;background:transparent;border:0;border-radius:0;
}
#offlineToolbar .profile-sort-option,#likesToolbar .profile-sort-option{
 display:flex;align-items:center;justify-content:space-between;gap:10px;
 width:100%;min-height:40px;padding:8px 10px;border-radius:8px;
 font-size:12px;text-align:right;direction:rtl;box-sizing:border-box;
}
#offlineToolbar .profile-sort-option[aria-pressed=true],#likesToolbar .profile-sort-option[aria-pressed=true]{
 background:rgba(180,160,225,.13);color:#ded0fb;
}
.profile-sort-check{width:16px;flex:0 0 16px;text-align:center;font-weight:700}
#offlineOptions.is-sort #offlineUsage,#likesOptions.is-sort #likesUsage{
 margin:6px 8px 2px;padding-top:6px;border-top:1px solid #8883;font-size:10px;
}
#likesToolbar .likes-tool-icon{
 display:flex;align-items:center;justify-content:center;width:34px;height:34px;
 padding:6px;flex:none;border-radius:8px;
}
body.light-theme #offlineToolbar .profile-sort-option[aria-pressed=true],
body.light-theme #likesToolbar .profile-sort-option[aria-pressed=true]{color:#5b397d;background:rgba(105,70,155,.1)}
