/* Desktop library. All rules are scoped to the dedicated desktop view. */
@media (min-width:861px) {
  body.library-page { background:radial-gradient(ellipse at 0 10%,#e2f8ef 0,transparent 32%),radial-gradient(ellipse at 100% 0,#e9faf2 0,transparent 30%),radial-gradient(ellipse at 85% 85%,#e6f9f1 0,transparent 40%),#fcfefd; }
  .library-page .page-shell {
    width:min(calc(100% - var(--desktop-shell-gutter)),clamp(var(--desktop-shell-min),var(--desktop-shell-fluid),var(--desktop-shell-max)));
    max-width:none;
    padding:clamp(14px,2vh,30px) 0 18px;
  }
  .library-page .site-footer { margin-bottom:100px; }
  .library-page .pl-desktop .pl-main { max-width:none; margin:0; padding:20px 0 130px; border:0; border-radius:0; background:transparent; min-height:calc(100dvh - 100px); }
  .pl-desktop-heading { position:relative; display:block; text-align:center; padding:10px 170px 22px; }
  .pl-desktop-heading h1 { width:100%; max-width:none; text-align:center; font-size:clamp(30px,3.2vw,48px); letter-spacing:-1.5px; font-weight:780; }
  .pl-desktop-heading>p { margin:8px 0 0; font-size:clamp(15px,1.3vw,20px); }
  .pl-flourish { position:absolute; top:0; font-family:"Segoe Print","Bradley Hand",cursive; color:#06a767; font-size:clamp(18px,1.7vw,28px); font-weight:400; line-height:1.5; transform:rotate(-10deg); }
  .pl-flourish::after { content:""; display:block; height:4px; background:#0bac68; border-radius:100% 0 100% 0; transform:rotate(-4deg); margin-top:6px; }
  .pl-flourish-left { left:25px; }
  .pl-flourish-right { right:25px; top:-8px; }
  .pl-desktop-layout { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:30px; align-items:start; }
  .pl-browser,.pl-right-column { min-width:0; }
  .pl-library-search { display:flex; align-items:center; gap:14px; height:55px; width:min(100%,740px); margin-left:auto; padding:0 20px; border:1px solid #d7efe3; border-radius:17px; background:#ffffffbd; box-shadow:0 5px 20px #1d805004; }
  .pl-library-search svg { color:#35414a; }
  .pl-library-search input { flex:1; min-width:0; padding:12px 0; border:0; background:transparent; color:#14221b; font-size:14px; box-shadow:none; }
  .pl-toolbar { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin:30px 0 26px; }
  .pl-desktop-tabs { display:flex; gap:9px; flex-wrap:wrap; }
  .pl-desktop-tabs button { min-height:43px; padding:10px 21px; border:0; border-radius:28px; background:#f0f4f3; font-size:13px; }
  .pl-desktop-tabs button[aria-pressed=true] { background:#00b653; color:white; font-weight:600; }
  .pl-sort-layout { display:flex; align-items:center; gap:8px; }
  .pl-sort-layout label { font-size:11px; color:#666b76; white-space:nowrap; }
  .pl-sort-layout select { width:auto; min-height:42px; padding:8px 28px 8px 12px; border:1px solid #e8f0eb; border-radius:14px; background:#fff; color:#19231e; font-size:12px; margin-left:5px; }
  .pl-sort-layout .pl-icon { width:43px; height:42px; background:#edf7f2; }
  .pl-sort-layout .pl-icon[aria-pressed=true] { color:#00b451; background:#d9f5e6; }
  .pl-desktop-cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; align-items:stretch; }
  .pl-grid-card { position:relative; min-width:0; overflow:hidden; background:#ffffffea; border:1px solid #eaf2ed; border-radius:11px; box-shadow:0 7px 20px #1c875005; }
  .pl-grid-card.is-selected { border-color:#a9e5c7; }
  .pl-grid-cover { display:block; width:100%; padding:0; border:0; background:transparent; }
  .pl-grid-cover .pl-cover { width:100%; height:auto; aspect-ratio:1.52; border-radius:0; }
  .pl-grid-card>.pl-grid-menu { position:absolute; top:10px; right:10px; width:32px; height:32px; background:#fffffff2; border-radius:9px; }
  .pl-grid-copy { position:relative; padding:13px 14px 14px; }
  .pl-desktop button.pl-grid-title { display:block; max-width:calc(100% - 35px); padding:0; border:0; background:none; font-size:14px; font-weight:700; text-align:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .pl-grid-copy>small { display:block; padding-right:28px; margin:6px 0 7px; color:#656976; font-size:10px; line-height:1.5; }
  .pl-grid-copy>p { font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .pl-app .pl-card-play { position:absolute; top:12px; right:11px; width:36px; height:36px; border-radius:50%; background:#00b750; color:white; }
  .pl-card-play svg { width:19px; height:19px; fill:currentColor; }
  .pl-create-card,.pl-discover-card { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; min-height:240px; padding:24px 14px; text-align:center; border:1px dashed #a0e2c4; border-radius:10px; background:#f7fdfaa6; }
  .pl-create-card>span,.pl-discover-card>span { display:grid; place-items:center; width:70px; height:70px; border-radius:50%; background:#def8eb; color:#036a42; }
  .pl-create-card>span svg,.pl-discover-card>span svg { width:32px; height:32px; }
  .pl-create-card strong,.pl-discover-card strong { font-size:16px; line-height:1.4; }
  .pl-create-card p,.pl-discover-card p { font-size:13px; line-height:1.7; }
  .pl-discover-card { border:0; background:linear-gradient(130deg,#effaf5,#e7f8f0); }
  .pl-discover-card>span { color:#00ad50; }
  .pl-discover-card button { display:flex; align-items:center; flex-direction:row-reverse; gap:12px; justify-content:center; border:1px solid #76d6a3; border-radius:30px; background:#fff; color:#00aa47; width:100%; padding:9px; font-weight:600; font-size:13px; }
  .pl-discover-card button svg { transform:rotate(180deg); width:16px; }
  .pl-grid-empty { grid-column:1/-1; text-align:center; padding:20px; font-size:14px; }
  .pl-app .pl-desktop-create { min-height:54px; width:calc(100% - 48px); margin:0 auto 20px; border-radius:16px; background:linear-gradient(110deg,#00bd57,#00b34a); }
  .pl-sidebar { border:1px solid #d3efdf; border-radius:20px; background:#ffffffbd; padding:19px; }
  .pl-sidebar-cover { display:flex; align-items:flex-start; justify-content:space-between; gap:15px; margin-bottom:12px; }
  .pl-sidebar-cover>.pl-cover { width:144px; height:140px; border-radius:12px; }
  .pl-sidebar-title { display:flex; align-items:center; justify-content:space-between; gap:12px; }
  .pl-sidebar-title h2 { font-size:22px; letter-spacing:-.6px; overflow-wrap:anywhere; }
  .pl-sidebar>p { font-size:12px; margin:4px 0; }
  .pl-sidebar-description { overflow-wrap:anywhere; }
  .pl-sidebar-play { display:flex; align-items:center; gap:18px; margin:16px 0 6px; }
  .pl-app .pl-green-play { width:53px; height:53px; flex-basis:53px; border-radius:50%; background:linear-gradient(110deg,#00c361,#00b34b); color:#fff; }
  .pl-green-play svg { fill:currentColor; width:24px; height:24px; }
  .pl-sidebar-timeline { flex:1; min-width:0; }
  .pl-sidebar-timeline>div { display:flex; justify-content:space-between; color:#626975; font-size:11px; }
  .pl-app input.pl-side-progress,.pl-bottom-volume input { --pl-progress:0%; appearance:none; -webkit-appearance:none; display:block; width:100%; height:18px; min-height:0; padding:0; margin:0; border:0; background:transparent; box-shadow:none; cursor:pointer; }
  .pl-app input.pl-side-progress::-webkit-slider-thumb { background:white; border:1px solid #d7dedb; }
  .pl-app input.pl-side-progress::-moz-range-thumb { background:white; border:1px solid #d7dedb; }
  .pl-transport { display:flex; justify-content:space-around; margin:0 0 10px; }
  .pl-transport .pl-icon,.pl-bottom-transport .pl-icon:not(.pl-green-play),.pl-bottom-volume .pl-icon { background:none; color:#47545b; }
  .pl-desktop [aria-pressed=true].pl-icon { color:#00b653; }
  .pl-desktop .pl-heart.is-favorite { color:#00b653; }
  .pl-sidebar-track-heading { display:flex; align-items:center; justify-content:space-between; font-size:13px; margin:8px 0 4px; }
  .pl-sidebar-track-heading .pl-icon { width:27px; height:27px; flex-basis:27px; padding:5px; background:transparent; }
  .pl-sidebar-track { display:flex; align-items:center; gap:7px; padding:4px 5px; min-height:37px; border-radius:8px; }
  .pl-sidebar-track.is-playing { background:#e3f7ed; }
  .pl-sidebar-track>span { width:18px; flex:0 0 18px; color:#67716c; font-size:11px; text-align:center; }
  .pl-sidebar-track>span>svg { color:#00b553; width:18px; height:18px; }
  .pl-sidebar-track>button:not(.pl-icon) { display:flex; align-items:center; min-width:0; flex:1; gap:10px; border:0; background:none; padding:0; text-align:left; }
  .pl-sidebar-track .pl-cover { width:32px; height:32px; border-radius:5px; }
  .pl-sidebar-track strong { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:11px; font-weight:600; }
  .pl-sidebar-track>small { color:#6b746e; font-size:11px; }
  .pl-sidebar-track .pl-icon { flex:0 0 22px; width:22px; height:26px; padding:2px; background:none; }
  .pl-show-tracks { width:100%; border:0; background:#f2f6f4; border-radius:13px; margin-top:9px; padding:12px; font-size:12px; }
  .pl-sidebar-empty { text-align:center; padding:35px 0; }
  .pl-sidebar-empty .pl-empty-art { margin:0 auto 25px; }
  .pl-sidebar-empty h2 { font-size:20px; margin-bottom:10px; }
  .pl-sidebar-empty p { font-size:13px; }
  .pl-bottom-player { position:fixed; bottom:0; left:0; right:0; z-index:100; display:grid; grid-template-columns:1fr 1fr 1fr; align-items:center; gap:24px; min-height:87px; padding:9px 40px; background:#ffffffed; border-top:1px solid #e3efe8; backdrop-filter:blur(15px); box-shadow:0 -6px 25px #1a694006; }
  .pl-bottom-track { display:flex; align-items:center; gap:14px; min-width:0; max-width:380px; }
  .pl-bottom-track>.pl-cover { width:64px; height:64px; border-radius:8px; }
  .pl-bottom-track .pl-copy { gap:3px; }
  .pl-bottom-track .pl-copy strong { font-size:13px; }
  .pl-bottom-transport { display:flex; align-items:center; justify-content:center; gap:19px; }
  .pl-bottom-center { min-width:0; display:grid; gap:3px; }
  .pl-bottom-timeline { display:flex; align-items:center; gap:10px; width:100%; color:#626975; font-size:11px; font-variant-numeric:tabular-nums; }
  .pl-bottom-timeline>span { flex:0 0 34px; text-align:center; }
  .pl-app input.pl-bottom-progress { --pl-progress:0%; appearance:none; -webkit-appearance:none; display:block; flex:1; width:100%; min-width:0; height:22px; min-height:0; padding:0; margin:0; border:0; background:transparent; box-shadow:none; cursor:pointer; }
  .pl-bottom-transport .pl-green-play { width:64px; height:64px; flex-basis:64px; }
  .pl-bottom-transport .pl-green-play svg { width:29px; height:29px; }
  .pl-bottom-volume { display:flex; justify-content:flex-end; align-items:center; gap:18px; }
  .pl-bottom-volume input { width:140px; accent-color:#00b653; }
  .pl-bottom-volume input::-webkit-slider-runnable-track { height:4px; border-radius:3px; background:linear-gradient(to right,#00b653 0 var(--volume,100%),#e1e9e4 var(--volume,100%) 100%); }
  .pl-bottom-volume input::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; width:11px; height:11px; margin-top:-3.5px; background:#fff; border:1px solid #cdd9d2; border-radius:50%; }
  .pl-bottom-volume input::-moz-range-track { height:4px; background:#e1e9e4; }
  .pl-bottom-volume input::-moz-range-progress { height:4px; background:#00b653; }
  .pl-bottom-volume input::-moz-range-thumb { width:10px; height:10px; border:1px solid #cdd9d2; border-radius:50%; background:white; }
  .pl-desktop-cards.is-list { grid-template-columns:1fr; }
  .is-list .pl-grid-card { display:flex; align-items:center; }
  .is-list .pl-grid-cover { width:110px; flex:0 0 110px; }
  .is-list .pl-grid-cover .pl-cover { aspect-ratio:1.2; }
  .is-list .pl-grid-copy { flex:1; min-width:0; padding-right:85px; }
  .is-list .pl-card-play { right:45px; top:calc(50% - 18px); }
  .is-list .pl-grid-menu { top:calc(50% - 16px); z-index:1; }
  .is-list .pl-create-card,.is-list .pl-discover-card { min-height:100px; flex-direction:row; padding:15px; }
  .is-list .pl-create-card>span,.is-list .pl-discover-card>span { width:50px; height:50px; flex-shrink:0; }
  .is-list .pl-discover-card button { width:auto; }
  .pl-desktop:fullscreen { padding:24px 36px; overflow:auto; background:#f4fcf8; }
}
@media (min-width:861px) and (max-width:1350px) {
  .pl-desktop-layout { grid-template-columns:minmax(0,1fr) 300px; gap:22px; }
  .pl-desktop-cards { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .pl-toolbar { gap:12px; margin-top:24px; }
  .pl-desktop-tabs button { padding:10px 16px; }
}
@media (min-width:861px) and (max-width:1080px) {
  .library-page .page-shell { padding:0 22px; }
  .pl-desktop-heading { padding-inline:110px; }
  .pl-flourish { font-size:18px; }
  .pl-flourish-left { left:0; } .pl-flourish-right { right:0; }
  .pl-desktop-layout { grid-template-columns:minmax(0,1fr) 275px; gap:20px; }
  .pl-desktop-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pl-bottom-player { padding-inline:20px; gap:15px; }
  .pl-bottom-transport { gap:8px; }
  .pl-bottom-volume input { width:85px; }
}

@media(min-width:861px) {
  .pl-app .pl-bottom-transport .pl-icon[data-pl-action="shuffle"][aria-pressed="true"],
  .pl-app .pl-transport .pl-icon[data-pl-action="shuffle"][aria-pressed="true"],
  .pl-app .pl-bottom-transport .pl-icon[data-pl-action="repeat"][aria-pressed="true"],
  .pl-app .pl-transport .pl-icon[data-pl-action="repeat"][aria-pressed="true"] {
    color:#00b653;
    background:#e0f7ea;
    box-shadow:inset 0 -3px 0 #00b653;
  }
}

@media(min-width:861px) {
  .pl-desktop-tabs button { display:inline-flex; align-items:center; justify-content:center; gap:7px; }
  .pl-desktop-tabs button>svg { width:17px; height:17px; }
  .pl-public-pagination { grid-column:1/-1; order:1; display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:7px; margin-top:18px; padding:16px 0; }
  .pl-public-pagination button { min-width:36px; min-height:36px; border:1px solid #dceee3; border-radius:10px; background:#fff; color:#27503c; }
  .pl-public-pagination button[aria-current="page"] { background:#00b653; color:#fff; border-color:#00b653; }
  .pl-public-pagination button:disabled { opacity:.35; cursor:default; }
  .pl-public-pagination .pl-page-next svg { transform:rotate(180deg); }
  .pl-public-pagination small { flex-basis:100%; text-align:center; color:#718277; margin-top:4px; }
}

@media(min-width:861px) {
  .pl-app .pl-sidebar-save { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:42px; margin:12px 0; padding:10px 12px; border:1px solid #00b66b; border-radius:12px; background:#eaf9f1; color:#008b50; font-size:13px; font-weight:600; }
  .pl-sidebar-save svg { width:19px; height:19px; }
  .pl-app .pl-sidebar-save[aria-pressed="true"] { border-color:#c7e3d4; background:#f4faf6; color:#496659; }
}