/* <!-- Lucian UX/UI Prompt #355 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#355 --> */
/* <!-- Lucian UX/UI Prompt #076 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#076 --> */
/* <!-- Lucian UX/UI Prompt #178 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#178 --> */
/* <!-- Lucian UX/UI Prompt #092 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#092 --> */
/* <!-- Lucian UX/UI Prompt #258 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#258 --> */
.u355 .u355-cloud{width:24px;height:20px;overflow:visible;flex:none}
.u355 .u355-cl{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}
.u355 .u355-d{fill:currentColor;stroke:none;opacity:0}
.u355[data-s=saving] .u355-d{opacity:1;animation:u355-bob .9s ease-in-out infinite}
.u355[data-s=saving] .u355-d:nth-of-type(2){animation-delay:.15s}
.u355[data-s=saving] .u355-d:nth-of-type(3){animation-delay:.3s}
.u355 .u355-ok{fill:none;stroke:#b4d6a3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:12;stroke-dashoffset:12;transition:stroke-dashoffset .35s cubic-bezier(.2,.8,.2,1)}
.u355[data-s=saved] .u355-ok{stroke-dashoffset:0}
.u355 .u355-sl{stroke:#c8b69a;stroke-width:2;stroke-linecap:round;stroke-dasharray:30;stroke-dashoffset:30;transition:stroke-dashoffset .35s cubic-bezier(.2,.8,.2,1)}
.u355[data-s=local] .u355-sl{stroke-dashoffset:0}
.u355 .u355-sy{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;opacity:0;transform-box:fill-box;transform-origin:50% 50%}
.u355[data-s=sync] .u355-sy{opacity:1;animation:u355-spin .8s linear infinite}
@keyframes u355-bob{50%{transform:translateY(-2.5px)}}
@keyframes u355-spin{to{transform:rotate(360deg)}}
.u076-tip{position:fixed;inset:0 auto auto 0;width:max-content;max-width:calc(100vw - 32px);height:max-content;margin:0;padding:0;border:0;background:none;color:#191b1f;overflow:visible;z-index:10000;opacity:0;transform:translate(var(--x,0px),var(--y,0px)) scale(.92);transition:opacity .16s,transform .16s;font-family:inherit}
.u076-tip.on{opacity:1;transform:translate(var(--x,0px),var(--y,0px))}
.u076-tip.glide{transition:opacity .16s,transform .32s cubic-bezier(.34,1.45,.64,1)}
.u076-tip .u076-box{position:relative;display:flex;align-items:center;gap:8px;min-height:34px;max-width:300px;padding:7px 11px;border-radius:10px;background:#f4f5f6;color:#191b1f;font-size:12.5px;font-weight:700;line-height:1.4;box-shadow:0 10px 20px -10px #0008}
.u076-tip .u076-box span{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.u076-tip.full-text .u076-box{max-width:min(360px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow-y:auto}
.u076-tip.full-text .u076-box span{display:block;-webkit-line-clamp:unset;overflow:visible;white-space:pre-wrap}
.u076-tip kbd{height:22px;padding:0 6px;border-radius:6px;display:inline-flex;align-items:center;background:#191b1f1a;font:inherit;font-size:11px;font-weight:750;flex:none}
.u076-tip kbd:empty{display:none}
.u076-tip .u076-arr{position:absolute;width:10px;height:10px;left:var(--ax,20px);margin-left:-5px;background:#f4f5f6;transform:rotate(45deg);border-radius:2px;transition:left .32s cubic-bezier(.34,1.45,.64,1)}
.u076-tip.below .u076-arr{top:-4px}.u076-tip.above .u076-arr{bottom:-4px}
.u178{font-size:13px;line-height:1.45;position:relative;font-variant-numeric:tabular-nums;margin-bottom:16px;max-width:100%}
.u178 button{border:1px solid #34383f;background:#191b1f;border-radius:9px;padding:9px 12px;min-height:44px;transition:background .2s,transform .3s,color .2s;color:#f4f5f6}
.u178 button:active{transform:translateY(1px)}.u178 button:disabled{opacity:.4;cursor:default}
.u178 .dock{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px;padding:7px 11px;border-radius:14px;background:#22252b;color:#f4f5f6;border:1px solid #34383f;margin-top:10px;transition:background .2s}
.u178 .count{margin-right:auto;font-weight:650;color:#d5dae1}.u178 .dock button{background:transparent;color:#c9cfd8;padding:6px 10px;font-size:12px;border-color:#424750}.u178 .dock button:hover{background:#ffffff08}.u178 .dock #playlist-remove-selected{color:#edb6bf}.u178 .dock #playlist-clear-selection{border-color:transparent;color:#a8b1be}
.u178 .restore{display:block;margin:10px 0 0;border:0;background:none;font-size:12px;padding:0;min-height:44px}
.u178 .dock[hidden],.u178 .restore[hidden]{display:none!important}
.u178 :focus-visible{outline:2px solid #f4f5f6;outline-offset:3px}
.u178-select-control{width:44px;min-height:44px;flex:none;display:grid;place-items:center;padding:0!important;background:none;border:0;color:#abb3bf}
.u178-select-control[aria-pressed=true]{color:#f4f5f6}
.u178-select-control svg{width:20px;height:20px}
.u092{padding:32px 12px;color:#f4f5f6}
.u092 .u092-none{display:flex;flex-direction:column;align-items:center;text-align:center}
.u092 .u092-none>svg{width:28px;height:28px;color:#abb3bf;margin-bottom:10px}
.u092 .u092-nt{margin:10px 0 0;font-size:16.5px;font-weight:850;letter-spacing:-.035em}
.u092 .u092-ns{margin:4px 0 0;font-size:12.5px;font-weight:600;color:#abb3bf}
.u092 .u092-sgs{display:flex;gap:6px;margin-top:14px;flex-wrap:wrap;justify-content:center}
.u092 .u092-sg{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:0;border-radius:999px;background:#24272d;font-size:13px;font-weight:700;color:#d2d6dd;text-align:left;animation:u092-up .45s cubic-bezier(.34,1.45,.64,1) backwards;animation-delay:calc(var(--i)*80ms + .1s);transition:background-color .2s,transform .3s cubic-bezier(.34,1.45,.64,1)}
.u092 .u092-sg:hover{background:#34383f;color:#f4f5f6}.u092 .u092-sg:active{transform:scale(.97)}
.u092 .u092-sg b{color:#f4f5f6;font-variant-numeric:tabular-nums}
@keyframes u092-up{from{opacity:0;transform:translateY(14px) scale(.95)}}
.u258-image{transform:scale(1);filter:none;transition:filter .8s ease,transform 1s cubic-bezier(.2,.8,.2,1)}
.u258-image.is-lq{filter:blur(12px) saturate(.75);transform:scale(1.15);transition:none}
@media(max-width:699px){.u178-select-control{width:36px}.u178 .dock{gap:6px}.u178 .count{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){.u355 *,.u076-tip,.u076-tip *,.u178 *,.u092 *,.u258-image{animation:none!important;transition:none!important}.u258-image.is-lq{filter:none;transform:none}}

.playlist-order .u178-select-control{width:44px;min-height:44px;padding:0;flex:none}

.u178-host{position:sticky;top:0;z-index:8;background:#191b1f;padding:6px 0}
@media(max-width:1023px){.u178-host{top:calc(68px + var(--archive-safe-top,env(safe-area-inset-top,0px)));background:#0f1115}}

@media(max-width:1023px){#content.u178-editing .track-group>.track.playlist-editing{display:grid;grid-template-columns:48px minmax(0,1fr) repeat(3,44px);gap:0;padding:8px 4px}#content.u178-editing .playlist-order{flex-direction:row;grid-column:1/-1;grid-row:1;justify-content:flex-end;gap:2px}#content.u178-editing .playlist-order button{width:44px;min-height:44px}#content.u178-editing .playlist-order .u178-select-control{margin-right:auto}#content.u178-editing .track-group>.track>.track-info{min-width:0}#content.u178-editing .playlist-items-remove{grid-column:1/3;justify-self:start;min-height:44px}}
/* <!-- Lucian UX/UI Prompt #007 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#007 --> */
/* Original 40×40 shape, 420ms curve and automatic centering; existing button slots and palette. */
#dock-play.u007-btn,#player-play.u007-btn{display:grid;place-items:center;padding:0;color:#000}
#dock-play.u007-btn>svg,#player-play.u007-btn>svg{width:24px;height:24px;display:block;margin:auto;overflow:visible}
#player-play.u007-btn>svg{width:40px;height:40px}
.u007-btn polygon{fill:currentColor;stroke:currentColor;stroke-width:2.4;stroke-linejoin:round}

/* Lucian UX/UI Prompt #006 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#006 */
.archive-press-target{isolation:isolate;transition:transform .45s cubic-bezier(.34,1.45,.64,1)}
.archive-press-target[data-archive-press-static=true]{position:relative}
.archive-press-target.archive-press-held:not(:disabled){transform:scale(.97)}
.archive-press-clip{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none;z-index:-1}
.archive-press-ink{position:absolute;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%;background:color-mix(in srgb,currentColor 16%,transparent);pointer-events:none;animation:archive-u006-ink .75s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes archive-u006-ink{from{transform:scale(0);opacity:.9}to{transform:scale(var(--s));opacity:1}}
@media(prefers-reduced-motion:reduce){.archive-press-target{transition:none!important}.archive-press-target.archive-press-held:not(:disabled){transform:none!important}.archive-press-clip{display:none!important}}
