:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#101014;--surface:#1a1a20;--surface-2:#24242c;--border:#2e2e38;--text:#f2f2f5;--muted:#9a9aa5;--accent:#5e96d6;--accent-hover:#7aabe3;--on-accent:#0b0b0f;--radius:12px;--radius-sm:8px;--sidebar-width:264px;--queue-width:300px;--player-height:84px}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font:15px/1.5 Golos Text,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.app{max-width:1100px;padding:20px 24px calc(var(--player-height) + 24px);margin:0 auto}.shell{padding-left:var(--sidebar-width)}.shell--with-queue{padding-right:var(--queue-width)}.sidebar{z-index:12;width:var(--sidebar-width);padding:12px 8px calc(12px + env(safe-area-inset-bottom));border-right:1px solid var(--border);background:var(--surface);grid-template-rows:auto minmax(0,1fr) auto;display:grid;position:fixed;top:0;bottom:0;left:0}.sidebar__top{align-items:center;gap:4px;display:flex}.sidebar__brand{border-radius:var(--radius-sm);min-width:0;color:var(--text);font:inherit;letter-spacing:-.01em;cursor:pointer;background:0 0;border:none;flex:1;align-items:center;gap:10px;padding:8px;font-size:17px;font-weight:600;display:flex}.sidebar__brand:hover{background:var(--surface-2)}.sidebar__brand img{border-radius:7px}.sidebar__user{border-radius:var(--radius-sm);grid-template-columns:auto minmax(0,1fr);align-items:center;gap:4px 10px;padding:10px 8px;display:grid}.sidebar__user:hover{background:var(--surface-2)}.sidebar__name{text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:500;overflow:hidden}.sidebar__logout{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:none;grid-column:2;justify-self:start;padding:0;font-size:12px}.sidebar__logout:hover{color:var(--accent)}.avatar{object-fit:cover;border-radius:50%;grid-row:span 2;width:32px;height:32px}.tree{padding:8px 0;overflow-y:auto}.tree__row{border-radius:var(--radius-sm);align-items:center;gap:2px;min-width:0;padding-right:8px;display:flex}.tree__row:hover{background:var(--surface-2)}.tree__row--current{background:color-mix(in srgb, var(--accent) 16%, transparent)}.tree__row--current .tree__name{color:var(--accent);font-weight:500}.tree__toggle{width:18px;height:26px;color:var(--muted);cursor:pointer;background:0 0;border:none;flex:none;place-items:center;padding:0;transition:transform .12s;display:grid}.tree__toggle--open{transform:rotate(90deg)}.tree__name{min-width:0;color:var(--text);font:inherit;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;background:0 0;border:none;flex:1;padding:4px 2px;font-size:13px;overflow:hidden}.tree__playing{color:var(--accent);flex:none;place-items:center;display:grid}.tree__playing svg{width:12px;height:12px}.tree__hint{color:var(--muted);padding:2px 0;font-size:12px}.avatar--initials{background:var(--accent);color:var(--on-accent);place-items:center;font-size:13px;font-weight:700;display:grid}.app--centered{min-height:60vh;color:var(--muted);place-items:center;display:grid}.login{place-items:center;min-height:100vh;padding:24px;display:grid}.login__card{border:1px solid var(--border);background:var(--surface);text-align:center;border-radius:20px;width:100%;max-width:460px;padding:40px 32px}.login__logo{border-radius:16px}.login__title{letter-spacing:-.02em;margin:16px 0 0;font-size:34px;font-weight:700;line-height:1.1}.login__lead{color:var(--muted);margin:12px 0 28px}.login__action{width:100%;padding:14px 20px;font-size:16px}.login__facts{border-top:1px solid var(--border);color:var(--muted);text-align:left;margin:28px 0 0;padding:24px 0 0;font-size:13px;list-style:none}.login__facts li{margin-bottom:10px;padding-left:18px;position:relative}.login__facts li:before{content:"";background:var(--accent);border-radius:50%;width:5px;height:5px;position:absolute;top:7px;left:4px}.login__facts li:last-child{margin-bottom:0}.button{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);font:inherit;cursor:pointer;padding:12px 20px;text-decoration:none;transition:background .15s,border-color .15s;display:inline-block}.button:hover{background:var(--surface-2)}.button--primary{background:var(--accent);color:var(--on-accent);border-color:#0000;font-weight:600}.button--primary:hover{background:var(--accent-hover)}.crumbs{flex-wrap:wrap;align-items:center;gap:4px;padding:8px 0 16px;font-size:14px;display:flex}.crumbs__link{color:var(--accent);font:inherit;cursor:pointer;background:0 0;border:none;padding:2px 4px}.crumbs__sep,.crumbs__current{color:var(--muted)}.folder-header{align-items:flex-end;gap:20px;margin-bottom:28px;display:flex}.folder-header__meta{min-width:0}.folder-header h1{letter-spacing:-.02em;overflow-wrap:anywhere;margin:0 0 16px;font-size:32px;font-weight:700;line-height:1.15}.folder-header__actions{flex-wrap:wrap;gap:8px;display:flex}.cover{border-radius:var(--radius);object-fit:cover;background:var(--surface);flex:none}.cover--empty{border:1px solid var(--border);background:linear-gradient(145deg, var(--surface-2), var(--surface));place-items:center;display:grid}.cover--empty:after{content:"♪";color:var(--border);font-size:44px;line-height:1}.cover--thumb.cover--empty:after{font-size:20px}.cover--large{width:176px;height:176px}.cover--thumb{width:48px;height:48px}.list{margin:0 0 20px;padding:0;list-style:none}.row{border-radius:var(--radius-sm);width:100%;color:var(--text);font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;align-items:center;gap:10px;padding:4px 8px;transition:background .12s;display:flex}.row:hover{background:var(--surface)}.row--compact{padding:3px 6px}.row__icon{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);width:30px;height:30px;color:var(--muted);flex:none;place-items:center;font-size:14px;display:grid}.pulse{background:currentColor;border-radius:50%;width:8px;height:8px;animation:1.6s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:.45;transform:scale(.55)}50%{opacity:1;transform:scale(1)}}.pulse--paused{opacity:.5;animation:none;transform:scale(.55)}.row__icon--number{font-variant-numeric:tabular-nums;background:0 0;border-color:#0000;font-size:12px}.row--playing .row__icon,.row--playing-folder .row__icon{background:color-mix(in srgb, var(--accent) 20%, transparent);color:var(--accent);border-color:#0000}.row:disabled{color:var(--muted);cursor:not-allowed}.row--playing,.row--playing-folder .row__title{color:var(--accent)}.row__title{text-overflow:ellipsis;white-space:nowrap;flex:0 auto;min-width:0;overflow:hidden}.row__badge{background:color-mix(in srgb, var(--accent) 18%, transparent);color:var(--accent);letter-spacing:.02em;border-radius:999px;flex:none;padding:2px 8px;font-size:11px;font-weight:600}.notice{background:var(--surface);color:var(--muted);border-radius:8px;padding:12px}.notice--error{color:#ff9b9b}.player{bottom:0;right:0;left:var(--sidebar-width);z-index:10;border-top:1px solid var(--border);background:color-mix(in srgb, var(--surface) 92%, transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);position:fixed}.player__seek{appearance:none;background:linear-gradient(to right, var(--accent) 0 var(--filled,0%), var(--border) var(--filled,0%) 100%);cursor:pointer;width:100%;height:4px;margin:0;display:block}.player__seek::-webkit-slider-thumb{appearance:none;background:var(--text);opacity:0;border-radius:50%;width:12px;height:12px;transition:opacity .12s}.player:hover .player__seek::-webkit-slider-thumb{opacity:1}.player__seek::-moz-range-thumb{background:var(--text);border:none;border-radius:50%;width:12px;height:12px}.player__body{padding:10px 20px calc(10px + env(safe-area-inset-bottom));grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:16px;display:grid}.player__track{align-items:center;gap:12px;min-width:0;display:flex}.player__titles{min-width:0}.player__name{text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:500;overflow:hidden}.player__source{max-width:100%;color:var(--muted);font:inherit;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;background:0 0;border:none;padding:0;font-size:12px;display:block;overflow:hidden}.player__source:hover{color:var(--accent)}.player__controls{align-items:center;gap:6px;display:flex}.player__extras{justify-content:flex-end;align-items:center;gap:8px;min-width:0;display:flex}.player__time{color:var(--muted);font-variant-numeric:tabular-nums;flex:none;font-size:12px}.player__time-sep{opacity:.5}.player__volume{align-items:center;gap:6px;display:flex}.player__volume-icon{color:var(--muted);place-items:center;display:grid}.range{appearance:none;background:linear-gradient(to right, var(--accent) 0 var(--filled,0%), var(--border) var(--filled,0%) 100%);cursor:pointer;border-radius:999px;min-width:0;height:4px}.range--volume{flex:none;width:76px}.range::-webkit-slider-thumb{appearance:none;background:var(--text);border-radius:50%;width:12px;height:12px}.range::-moz-range-thumb{background:var(--text);border:none;border-radius:50%;width:12px;height:12px}.icon-button{width:34px;height:34px;color:var(--text);cursor:pointer;background:0 0;border:none;border-radius:50%;place-items:center;padding:0;transition:background .12s,color .12s;display:grid}.icon-button:hover{background:var(--surface-2)}.icon-button--main{background:var(--accent);width:46px;height:46px;color:var(--on-accent)}.icon-button--main:hover{background:var(--accent-hover)}.icon-button--active{color:var(--accent)}.icon-button--small{width:30px;height:30px;color:var(--muted)}.icon-button--small:hover:not(:disabled){color:var(--text)}.spinner{vertical-align:-2px;border:2px solid;border-top-color:#0000;border-radius:50%;width:13px;height:13px;margin-right:8px;animation:.7s linear infinite spin;display:inline-block}.toast .spinner{margin-right:6px}.icon-button--busy{cursor:progress;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.menu{z-index:20;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2);min-width:176px;padding:4px;position:fixed;box-shadow:0 12px 32px #00000080}.menu__item{width:100%;color:var(--text);font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:8px 10px;font-size:13px;display:block}.menu__item:hover{background:color-mix(in srgb, var(--accent) 22%, transparent)}.toast{bottom:calc(var(--player-height) + 16px);z-index:21;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2);max-width:min(420px,100vw - 32px);color:var(--text);padding:10px 14px;font-size:13px;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 12px 32px #00000080}.toast--error{border-color:color-mix(in srgb, #ff9b9b 40%, var(--border));color:#ffd7d7;font:inherit;text-align:left;cursor:pointer;font-size:13px}.queue{top:0;right:0;bottom:var(--player-height);z-index:9;width:var(--queue-width);border-left:1px solid var(--border);background:var(--surface);flex-direction:column;padding:16px 12px;display:flex;position:fixed}.queue__header{align-items:center;gap:8px;padding:0 4px 12px;display:flex}.queue__header h2{margin:0;font-size:15px}.queue__count{background:var(--surface-2);color:var(--muted);font-variant-numeric:tabular-nums;border-radius:999px;padding:1px 8px;font-size:12px}.queue__header .icon-button{margin-left:auto}.queue__list{flex:1;min-height:0;margin:0;overflow-y:auto}.queue__empty{color:var(--muted);margin:0 4px;font-size:13px}@media (width<=1100px){.shell,.shell--with-queue{padding-left:0;padding-right:0}.sidebar{display:none}.queue{top:auto;right:0;bottom:var(--player-height);border-top:1px solid var(--border);border-left:none;width:auto;max-height:60vh;left:0;box-shadow:0 -12px 32px #00000073}.player{left:0}}@media (width<=720px){.app{padding:12px 12px calc(var(--player-height) + 20px)}.folder-header{flex-direction:column;align-items:stretch}.cover--large{aspect-ratio:1;width:100%;max-width:240px;height:auto}.folder-header h1{font-size:26px}.player__body{padding:8px 12px calc(8px + env(safe-area-inset-bottom));grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"track extras""controls controls";gap:8px}.player__track{grid-area:track}.player__extras{grid-area:extras}.player__controls{grid-area:controls;justify-content:center}.player__volume{display:none}}@media (prefers-reduced-motion:reduce){*{transition:none!important}.pulse{animation:none}.spinner{animation-duration:2s}}