:root{--media-footer-h:80px}.os-window__content--media,.now-playing{--media-ink:#fff;--media-ink-dim:color-mix(in srgb, var(--media-ink) 66%, var(--app-surface));--media-ink-faint:color-mix(in srgb, var(--media-ink) 55%, var(--app-surface));--media-raised:color-mix(in srgb, var(--media-ink) 6%, var(--app-surface));--media-hover:color-mix(in srgb, var(--media-ink) 12%, var(--app-surface));--media-press:color-mix(in srgb, var(--media-ink) 18%, var(--app-surface));--media-sunk:#000;--media-hairline:color-mix(in srgb, var(--media-ink) 14%, transparent)}.media-shelf__row::-webkit-scrollbar{width:12px;height:12px}.media-main::-webkit-scrollbar{width:12px;height:12px}.media-sidebar::-webkit-scrollbar{width:12px;height:12px}.os-window__content--media::-webkit-scrollbar{width:12px;height:12px}.media-shelf__row::-webkit-scrollbar-thumb{background:var(--media-ink-faint);border-radius:var(--r-chip);background-clip:padding-box;border:3px solid #0000}.media-main::-webkit-scrollbar-thumb{background:var(--media-ink-faint);border-radius:var(--r-chip);background-clip:padding-box;border:3px solid #0000}.media-sidebar::-webkit-scrollbar-thumb{background:var(--media-ink-faint);border-radius:var(--r-chip);background-clip:padding-box;border:3px solid #0000}.os-window__content--media::-webkit-scrollbar-thumb{background:var(--media-ink-faint);border-radius:var(--r-chip);background-clip:padding-box;border:3px solid #0000}.media-shelf__row::-webkit-scrollbar-thumb:hover{background:var(--media-ink-dim);background-clip:padding-box}.media-main::-webkit-scrollbar-thumb:hover{background:var(--media-ink-dim);background-clip:padding-box}.media-sidebar::-webkit-scrollbar-thumb:hover{background:var(--media-ink-dim);background-clip:padding-box}.os-window__content--media::-webkit-scrollbar-thumb:hover{background:var(--media-ink-dim);background-clip:padding-box}.media-shelf__row::-webkit-scrollbar-track{background:0 0}.media-main::-webkit-scrollbar-track{background:0 0}.media-sidebar::-webkit-scrollbar-track{background:0 0}.os-window__content--media::-webkit-scrollbar-track{background:0 0}.os-window__content--media{background:var(--app-surface);height:100%;min-height:0;color:var(--media-ink);flex-direction:column;padding:0;display:flex;overflow:hidden}.media-app{height:100%;min-height:0;font-family:var(--lx-font-body);background:var(--app-surface);display:flex}.media-sidebar{background:var(--media-sunk);width:232px;padding:var(--sp-4) var(--sp-2);gap:var(--sp-5);flex-direction:column;flex:0 0 232px;display:flex;overflow-y:auto}.media-sidebar__section{gap:var(--sp-1);flex-direction:column;display:flex}.media-sidebar__heading{font-family:var(--os-font-mono);font-size:var(--fs-chrome-xs);letter-spacing:.12em;text-transform:uppercase;color:var(--media-ink-faint);padding:0 var(--sp-3) var(--sp-2);font-weight:700}.media-sidebar__item{align-items:center;gap:var(--sp-3);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-control);color:var(--media-ink-dim);font-size:var(--fs-body);text-align:left;cursor:pointer;width:100%;transition:color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);background:0 0;border:0;font-weight:400;text-decoration:none;display:flex}.media-sidebar__item i{text-align:center;width:16px;font-size:var(--fs-sm);color:currentColor}.media-sidebar__item:hover,.media-sidebar__item:focus,.media-sidebar__item:active,.media-sidebar__item.active{text-decoration:none}.media-sidebar__item:focus-visible{outline:2.5px solid var(--focus);outline-offset:2px}.media-sidebar__item:hover{color:var(--media-ink);background:var(--media-hover)}.media-sidebar__item.active{color:var(--media-ink);background:var(--media-hover);font-weight:600}.media-sidebar__item.active i{color:var(--app-hue)}.media-sidebar__count{font-family:var(--os-font-mono);font-size:var(--fs-chrome-xs);color:var(--media-ink-faint);margin-left:auto;font-weight:400}.media-main{min-width:0;padding:var(--sp-5) var(--sp-5) var(--sp-7);background:var(--app-surface);flex:1;overflow-y:auto}.media-main__header{margin-bottom:var(--sp-6)}.media-main__title{font-family:var(--lx-font-heading);font-size:var(--fs-2xl);font-weight:400;line-height:var(--lh-display);color:var(--media-ink);margin:0}.media-main__sub{margin:var(--sp-2) 0 0;font-family:var(--os-font-mono);font-size:var(--fs-chrome-xs);letter-spacing:.12em;text-transform:uppercase;color:var(--media-ink-faint);font-weight:700}.media-content{gap:var(--sp-6);flex-direction:column;display:flex}.media-shelf{padding:0}.media-shelf__head{margin:0 0 var(--sp-4);justify-content:space-between;align-items:baseline;display:flex}.media-shelf__heading{font-family:var(--lx-font-heading);font-size:var(--fs-lg);font-weight:400;line-height:var(--lh-title);color:var(--media-ink);margin:0}.media-shelf__heading a{color:inherit;text-decoration:none}.media-shelf__heading a:hover{text-decoration:underline}.media-shelf__all{font-size:var(--fs-sm);color:var(--app-hue);white-space:nowrap;font-weight:600;text-decoration:none}.media-shelf__all:hover{text-decoration:underline}.media-shelf__row{gap:var(--sp-4);padding-bottom:var(--sp-2);scroll-snap-type:x proximity;display:flex;overflow-x:auto}.media-shelf__row .media-card-wrap{scroll-snap-align:start;flex:0 0 180px;width:180px}.media-shelf__grid{gap:var(--sp-4);grid-template-columns:repeat(auto-fill,minmax(180px,1fr));display:grid}.media-card-wrap{padding:var(--sp-4);border:1px solid var(--media-hairline);border-radius:var(--r-card);background:var(--media-raised);box-shadow:var(--sh-card);transition:background var(--dur-base) var(--ease-out);flex-direction:column;display:flex;position:relative}.media-card-wrap:hover,.media-card-wrap:focus-within{background:var(--media-hover)}.media-card-wrap:hover .media-card__play,.media-card-wrap:focus-within .media-card__play{opacity:1;transform:translateY(0)}.media-card-wrap--playing .media-card__title{color:var(--app-hue)}.media-card-wrap--playing .media-card__play{opacity:1;transform:translateY(0)}.media-card{color:inherit;flex-direction:column;text-decoration:none;display:flex}.media-card:focus-visible{outline:2.5px solid var(--focus);outline-offset:2px}.media-card--button{font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;width:100%;margin:0;padding:0}.media-card__art{aspect-ratio:1;border-radius:var(--r-chip);background:var(--media-sunk);width:100%;box-shadow:var(--sh-card);position:relative;overflow:visible}.media-card__art--square{aspect-ratio:1}.media-card__art--playlist:before,.media-card__art--playlist:after{content:"";border-radius:var(--r-chip);z-index:var(--z-below);position:absolute;inset:0}.media-card__art--playlist:before{background:var(--media-press);transform:translate(3px,-3px)}.media-card__art--playlist:after{background:var(--media-hover);transform:translate(6px,-6px)}.media-card__art-img,.media-card__art-fallback{border-radius:var(--r-chip)}.media-card__art-img{object-fit:cover;width:100%;height:100%;display:block}.media-card__art-fallback{font-size:var(--fs-xl);color:var(--media-ink-dim);background:linear-gradient(150deg, var(--media-press), var(--app-surface));justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.media-card__duration{z-index:var(--z-base);background:color-mix(in srgb, var(--media-sunk) 70%, transparent);color:var(--media-ink);font-family:var(--os-font-mono);font-size:var(--fs-chrome-xs);letter-spacing:.02em;padding:var(--sp-1) var(--sp-2);border-radius:var(--r-chip);font-weight:400;position:absolute;bottom:8px;left:8px}.media-card__play{z-index:var(--z-raised);background:var(--action);border:var(--edge-lit);width:48px;height:48px;color:var(--surface);font-size:var(--fs-body);box-shadow:var(--sh-button);opacity:0;transition:opacity var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out), background var(--dur-fast) var(--ease-out);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;bottom:8px;right:8px;transform:translateY(8px)}.media-card__play i{margin-left:2px}.media-card__play:hover{background:var(--action-hover)}.media-card__play:focus-visible{outline:2.5px solid var(--focus);outline-offset:2px;opacity:1;transform:translateY(0)}.media-card__play:active{box-shadow:var(--sh-press);transform:translateY(1px)}.media-card__title{margin-top:var(--sp-3);font-family:var(--lx-font-body);font-size:var(--fs-body);font-weight:600;line-height:var(--lh-title);color:var(--media-ink);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.media-card__byline{margin-top:var(--sp-2);font-size:var(--fs-sm);font-weight:400;line-height:var(--lh-body);color:var(--media-ink-dim);-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.media-shelf__row .media-card-wrap:nth-child(5n+1) .media-card__art-fallback,.media-shelf__grid .media-card-wrap:nth-child(5n+1) .media-card__art-fallback{background:linear-gradient(150deg, color-mix(in srgb, var(--sage-mid) 45%, var(--app-surface)), var(--app-surface))}.media-shelf__row .media-card-wrap:nth-child(5n+2) .media-card__art-fallback,.media-shelf__grid .media-card-wrap:nth-child(5n+2) .media-card__art-fallback{background:linear-gradient(150deg, color-mix(in srgb, var(--lilac-mid) 45%, var(--app-surface)), var(--app-surface))}.media-shelf__row .media-card-wrap:nth-child(5n+3) .media-card__art-fallback,.media-shelf__grid .media-card-wrap:nth-child(5n+3) .media-card__art-fallback{background:linear-gradient(150deg, color-mix(in srgb, var(--clay-mid) 45%, var(--app-surface)), var(--app-surface))}.media-shelf__row .media-card-wrap:nth-child(5n+4) .media-card__art-fallback,.media-shelf__grid .media-card-wrap:nth-child(5n+4) .media-card__art-fallback{background:linear-gradient(150deg, color-mix(in srgb, var(--sky-mid) 45%, var(--app-surface)), var(--app-surface))}.media-shelf__row .media-card-wrap:nth-child(5n+5) .media-card__art-fallback,.media-shelf__grid .media-card-wrap:nth-child(5n+5) .media-card__art-fallback{background:linear-gradient(150deg, color-mix(in srgb, var(--lemon-mid) 45%, var(--app-surface)), var(--app-surface))}.media-card__save{z-index:calc(var(--z-raised) + 1);background:color-mix(in srgb, var(--media-sunk) 55%, transparent);width:30px;height:30px;color:var(--media-ink-dim);cursor:pointer;font-size:var(--fs-body);opacity:0;transition:opacity var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);border:0;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:20px;right:20px}.media-card__save:hover{color:var(--media-ink)}.media-card__save:focus-visible{outline:2.5px solid var(--focus);outline-offset:2px;opacity:1}.media-card__save--on{opacity:1;color:var(--app-hue)}.media-card-wrap:hover .media-card__save,.media-card-wrap:focus-within .media-card__save{opacity:1}.media-lang-grid{gap:var(--sp-4);grid-template-columns:repeat(auto-fill,minmax(170px,1fr));display:grid}.media-lang-folder{align-items:center;gap:var(--sp-3);padding:var(--sp-5) var(--sp-3);border:1px solid var(--media-hairline);border-radius:var(--r-card);background:var(--media-raised);color:var(--media-ink);transition:background var(--dur-base) var(--ease-out);flex-direction:column;text-decoration:none;display:flex;position:relative}.media-lang-folder:hover{background:var(--media-hover)}.media-lang-folder:focus-visible{outline:2.5px solid var(--focus);outline-offset:2px}.media-lang-folder i{font-size:var(--fs-xl);color:var(--app-hue)}.media-lang-folder__name{font-weight:600;font-size:var(--fs-body);text-align:center}.media-lang-folder__count{font-family:var(--os-font-mono);font-size:var(--fs-chrome-xs);color:var(--media-ink-faint);font-weight:700;position:absolute;top:10px;right:12px}.media-empty{align-items:center;gap:var(--sp-3);padding:var(--sp-8) var(--sp-4);color:var(--media-ink-dim);flex-direction:column;display:flex}.media-empty i{font-size:var(--fs-xl);color:var(--media-ink-faint)}.media-empty p{font-size:var(--fs-body-lg);margin:0}.media-main--detail{padding-bottom:var(--sp-7)}.media-detail{max-width:760px;margin:0 auto;padding:0}.media-detail__video,.media-detail__spotify{border-radius:var(--r-card);box-shadow:var(--sh-card);background:var(--media-sunk);overflow:hidden}.media-detail__video{aspect-ratio:16/9;position:relative}.media-detail__video iframe{border:0;width:100%;height:100%;position:absolute;inset:0}.media-detail__spotify iframe{border:0;width:100%;height:232px;display:block}.media-detail__info{margin-top:var(--sp-5)}.media-detail__title{font-family:var(--lx-font-heading);font-size:var(--fs-lg);line-height:var(--lh-title);color:var(--media-ink);-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;margin:0;font-weight:400;display:-webkit-box;overflow:hidden}.media-detail__byline{margin-top:var(--sp-2);color:var(--media-ink-dim);font-size:var(--fs-body);font-weight:500}.media-detail__meta{gap:var(--sp-2);margin-top:var(--sp-3);font-family:var(--os-font-mono);font-size:var(--fs-chrome-xs);text-transform:uppercase;letter-spacing:.04em;flex-wrap:wrap;font-weight:400;display:flex}.media-detail__meta span{border-radius:var(--r-chip);padding:var(--sp-1) var(--sp-2);background:var(--media-hover);color:var(--media-ink-dim)}.media-detail__spotify-link{align-items:center;gap:var(--sp-2);margin-top:var(--sp-4);padding:var(--sp-3) var(--sp-5);border:var(--edge-lit);border-radius:var(--r-control);background:var(--action);color:var(--surface);font-size:var(--fs-body);box-shadow:var(--sh-button);transition:background var(--dur-fast) var(--ease-out);font-weight:600;text-decoration:none;display:inline-flex}.media-detail__spotify-link:hover{background:var(--action-hover);color:var(--surface)}.media-detail__spotify-link:focus-visible{outline:2.5px solid var(--focus);outline-offset:2px}.media-detail__spotify-link:active{box-shadow:var(--sh-press);transform:translateY(1px)}.media-detail__save{align-items:center;gap:var(--sp-2);margin:var(--sp-4) 0 0 var(--sp-3);padding:var(--sp-3) var(--sp-5);border:1px solid var(--media-ink-dim);border-radius:var(--r-control);color:var(--media-ink);font-size:var(--fs-body);cursor:pointer;transition:border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);background:0 0;font-weight:600;display:inline-flex}.media-detail__save:hover{border-color:var(--media-ink)}.media-detail__save:focus-visible{outline:2.5px solid var(--focus);outline-offset:2px}.media-detail__save:active{box-shadow:var(--sh-press);transform:translateY(1px)}.media-detail__save--on{color:var(--app-hue);border-color:var(--app-hue)}.media-detail__save--on i{color:var(--app-hue)}.media-detail__desc{margin-top:var(--sp-5);line-height:var(--lh-body);color:var(--media-ink-dim);font-size:var(--fs-body)}.media-detail__browse{gap:var(--sp-2);margin-top:var(--sp-5);flex-wrap:wrap;display:flex}.media-detail__browse-btn{align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-4);border-radius:var(--r-control);background:var(--media-hover);color:var(--media-ink);font-weight:600;font-size:var(--fs-sm);transition:background var(--dur-fast) var(--ease-out);border:0;text-decoration:none;display:inline-flex}.media-detail__browse-btn:hover{background:var(--media-press)}.media-detail__browse-btn:focus-visible{outline:2.5px solid var(--focus);outline-offset:2px}.now-playing{width:100%;height:var(--media-footer-h);background:var(--media-raised);border-top:1px solid var(--media-hairline);color:var(--media-ink);align-items:center;gap:var(--sp-4);padding:0 var(--sp-4);transition:height var(--dur-base) var(--ease-out), opacity var(--dur-base) var(--ease-out);grid-template-columns:minmax(180px,28%) 1fr minmax(120px,28%);display:grid;overflow:hidden}.now-playing--hidden{opacity:0;pointer-events:none;border-top-color:#0000;height:0}.now-playing__left{align-items:center;gap:var(--sp-3);min-width:0;display:flex}.now-playing__video{border-radius:var(--r-chip);background:var(--media-sunk);width:56px;height:56px;box-shadow:var(--sh-raise);flex:none;overflow:hidden}.now-playing__video-img{object-fit:cover;width:100%;height:100%;display:block}.now-playing__meta{min-width:0}.now-playing__title{font-size:var(--fs-body);color:var(--media-ink);white-space:nowrap;text-overflow:ellipsis;font-weight:600;overflow:hidden}.now-playing__byline{font-size:var(--fs-sm);color:var(--media-ink-dim);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.now-playing__save{color:var(--media-ink-dim);cursor:pointer;font-size:var(--fs-body-lg);padding:var(--sp-1);transition:color var(--dur-fast) var(--ease-out);background:0 0;border:0;flex:none}.now-playing__save:hover{color:var(--media-ink)}.now-playing__save:focus-visible{outline:2.5px solid var(--focus);outline-offset:2px}.now-playing__save--on{color:var(--app-hue)}.now-playing__center{align-items:center;gap:var(--sp-1);flex-direction:column;min-width:0;display:flex}.now-playing__controls{align-items:center;gap:var(--sp-4);display:flex}.now-playing__btn{color:var(--media-ink-dim);cursor:pointer;width:32px;height:32px;font-size:var(--fs-body);transition:color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);background:0 0;border:0;border-radius:50%;justify-content:center;align-items:center;display:inline-flex}.now-playing__btn:hover{color:var(--media-ink)}.now-playing__btn:focus-visible{outline:2.5px solid var(--focus);outline-offset:2px}.now-playing__btn:active{box-shadow:var(--sh-press);transform:translateY(1px)}.now-playing__btn--play{background:var(--action);border:var(--edge-lit);color:var(--surface);width:38px;height:38px;box-shadow:var(--sh-button)}.now-playing__btn--play:hover{background:var(--action-hover);color:var(--surface)}.now-playing__btn--saved{color:var(--app-hue)}.now-playing__progress{align-items:center;gap:var(--sp-2);width:100%;max-width:620px;display:flex}.now-playing__time{font-family:var(--os-font-mono);font-size:var(--fs-chrome-xs);color:var(--media-ink-dim);text-align:center;flex:none;min-width:34px}.now-playing__seek{min-width:0;height:4px;accent-color:var(--app-hue);cursor:pointer;flex:1}.now-playing__right{justify-content:flex-end;align-items:center;gap:var(--sp-2);display:flex}@media (width<=767.98px){.now-playing{gap:var(--sp-2);padding:0 var(--sp-2);display:flex}.now-playing__left{flex:auto}.now-playing__center{flex:none}.now-playing__progress{display:none}.now-playing__controls{gap:var(--sp-2)}.now-playing__right{flex:none}:root[data-np-active="1"] .os-body{padding-bottom:var(--media-footer-h)}.os-window__content--media{height:auto;overflow:visible}.media-app{flex-direction:column;height:auto}.media-sidebar{border-bottom:1px solid var(--media-hairline);flex:none;width:100%}.media-sidebar__section{gap:var(--sp-2);flex-flow:wrap}.media-sidebar__heading{width:100%}.media-sidebar__item{width:auto}.media-main{background:var(--app-surface);overflow:visible}.media-main--detail{padding:var(--sp-4)}}