.sd316-wrap{direction:rtl;color:#fff;font-family:system-ui;display:grid;gap:24px}
.sd316-section,.sd316-hero{background:#111827;border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:18px}
.sd316-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.sd316-card{background:#0b1220;border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:14px;height:100%}
.sd316-cover{width:100%;aspect-ratio:1/1;border-radius:14px;background:#1e293b;object-fit:cover}
.sd316-title{font-weight:800;margin-top:10px}
.sd316-sub{opacity:.8;font-size:14px;margin-top:4px}
.sd316-metrics{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px;font-size:12px;opacity:.75}
.sd316-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.sd316-btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 13px;border-radius:12px;background:linear-gradient(180deg,#2563eb,#1d4ed8);color:#fff;text-decoration:none;border:0;cursor:pointer;font-size:13px}
.sd316-open{background:linear-gradient(180deg,#334155,#1f2937)}
.sd316-hero{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:center;background:linear-gradient(135deg,#111827,#0f172a,#1e1b4b)}
.sd316-hero h1{margin:8px 0 10px;font-size:48px;line-height:1.1}
.sd316-hero p{margin:0;font-size:18px;opacity:.86}
.sd316-eyebrow{font-size:12px;letter-spacing:.18em;opacity:.7}
.sd316-tracklist{display:grid;gap:10px}
.sd316-trackrow{display:grid;grid-template-columns:80px 1fr 90px;gap:12px;padding:12px 14px;border-radius:14px;background:#0b1220;border:1px solid rgba(255,255,255,.06)}
.sd316-empty{opacity:.75}
.sd316-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:12px}
.sd316-carousel-nav{display:flex;gap:8px}
.sd316-nav-btn{background:#1f2937;color:#fff;border:0;border-radius:999px;padding:8px 12px;cursor:pointer}
.sd316-carousel{overflow:hidden}
.sd316-track{display:flex;gap:18px;transition:transform .35s ease}
.sd316-slide{min-width:calc(25% - 13.5px)}
.sd316-player{position:fixed;left:12px;right:12px;bottom:12px;background:linear-gradient(180deg,rgba(9,14,27,.76),rgba(7,11,22,.90));backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border:1px solid rgba(255,255,255,.10);box-shadow:0 18px 50px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.05);border-radius:26px;padding:14px 16px;display:grid;grid-template-columns:72px minmax(160px,240px) auto minmax(220px,1fr) auto;align-items:center;gap:14px;z-index:9999}
.sd316-player img{width:72px;height:72px;border-radius:18px;object-fit:cover;background:#1e293b;box-shadow:0 10px 24px rgba(0,0,0,.28);flex-shrink:0}
.sd316-player-meta{min-width:0;max-width:240px;overflow:hidden}
.sd316-player-title{font-weight:800;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sd316-player-sub{font-size:13px;opacity:.78;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:4px}
.sd316-player-main{display:flex;align-items:center;gap:10px;min-width:0}
.sd316-player audio{width:100%;min-width:0;height:40px;border-radius:999px;opacity:.95}
.sd316-player-side{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.sd316-smallbtn{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.10);border-radius:999px;padding:10px 13px;cursor:pointer;transition:transform .15s ease,background .15s ease,border-color .15s ease;min-width:42px;line-height:1}
.sd316-smallbtn.active{background:rgba(239,68,68,.22);border-color:rgba(239,68,68,.55);color:#fff}
.sd316-queue{position:fixed;right:-380px;top:0;width:360px;height:100vh;background:#020617;border-left:1px solid #1e293b;padding:18px;transition:right .25s ease;overflow:auto;z-index:10000}
.sd316-queue.open{right:0}
.sd316-queue-item{display:grid;grid-template-columns:50px 1fr auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.06)}
.sd316-queue-item img{width:50px;height:50px;border-radius:8px;object-fit:cover}
.sd316-mini{position:fixed;left:16px;bottom:110px;background:linear-gradient(180deg,rgba(9,14,27,.82),rgba(7,11,22,.92));backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:10px 12px;display:none;align-items:center;gap:10px;z-index:9998;box-shadow:0 12px 28px rgba(0,0,0,.35)}
.sd316-mini.show{display:flex}
.sd316-mini img{width:42px;height:42px;border-radius:8px;object-fit:cover}
.sd316-mini button{background:#fff;color:#000;border:0;border-radius:999px;padding:6px 10px;cursor:pointer}
.sd316-toast{position:fixed;bottom:110px;right:20px;background:#111827;color:#fff;border:1px solid rgba(255,255,255,.08);padding:10px 14px;border-radius:14px;z-index:10001;opacity:0;transform:translateY(10px);transition:all .2s ease}
.sd316-toast.show{opacity:1;transform:translateY(0)}
.sd316-library-hero{padding:22px;border-radius:22px;background:linear-gradient(135deg,#1d4ed8,#312e81,#0f172a);border:1px solid rgba(255,255,255,.08)}
.sd316-library-hero h2{margin:8px 0 6px;font-size:36px}
.sd316-library-hero p{margin:0;opacity:.85}
.sd316-library-badge{display:inline-flex;background:rgba(255,255,255,.12);padding:8px 12px;border-radius:999px;font-size:12px}
.sd316-library-shell{display:grid;gap:18px}
.sd316-stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.sd316-stat-card{background:linear-gradient(180deg,#101827,#0b1220);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:18px;text-align:center}
.sd316-stat-number{font-size:34px;font-weight:800;line-height:1}
.sd316-stat-label{margin-top:8px;opacity:.8}
.sd316-library-tools{display:grid;grid-template-columns:1fr 220px;gap:12px}
.sd316-search,.sd316-sort{background:#0b1220;color:#fff;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:12px 14px}
.sd316-library-tabs{display:flex;gap:10px;flex-wrap:wrap}
.sd316-tab{background:#0b1220;border:1px solid rgba(255,255,255,.08);color:#fff;border-radius:999px;padding:10px 16px;cursor:pointer}
.sd316-tab.active{background:#2563eb}
.sd316-tab-panel{display:none}
.sd316-tab-panel.active{display:block}
body{padding-bottom:120px}
@media(max-width:1200px){.sd316-slide{min-width:calc(33.333% - 12px)}.sd316-player{grid-template-columns:72px 1fr auto;grid-template-areas:"cover meta side" "main main main"}.sd316-player img{grid-area:cover}.sd316-player-meta{grid-area:meta;max-width:none}.sd316-player-side{grid-area:side}.sd316-player-main{grid-area:main}}.sd316-player{position:fixed;left:12px;right:12px;bottom:12px;background:linear-gradient(180deg,rgba(9,14,27,.76),rgba(7,11,22,.90));backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border:1px solid rgba(255,255,255,.10);box-shadow:0 18px 50px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.05);border-radius:26px;padding:14px 16px;display:grid;grid-template-columns:72px minmax(160px,240px) auto minmax(220px,1fr) auto;align-items:center;gap:14px;z-index:9999}.sd316-player-main{display:flex;align-items:center;gap:10px;min-width:0}}
@media(max-width:980px){.sd316-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sd316-hero{grid-template-columns:1fr}.sd316-queue{width:100%;right:-100%}.sd316-slide{min-width:calc(50% - 9px)}.sd316-stats-grid{grid-template-columns:1fr}.sd316-library-tools{grid-template-columns:1fr}}.sd316-hero{grid-template-columns:1fr}.sd316-queue{width:100%;right:-100%}.sd316-slide{min-width:calc(50% - 9px)}.sd316-stats-grid{grid-template-columns:1fr}.sd316-library-tools{grid-template-columns:1fr}}
@media(max-width:560px){.sd316-grid{grid-template-columns:1fr}.sd316-trackrow{grid-template-columns:60px 1fr 70px}.sd316-slide{min-width:100%}.sd316-player{left:8px;right:8px;bottom:8px;padding:12px 12px 14px;border-radius:22px;grid-template-columns:56px 1fr auto;grid-template-areas:"cover meta side" "main main main";gap:10px}.sd316-player img{width:56px;height:56px;border-radius:14px}.sd316-player-main{flex-wrap:wrap;gap:8px}.sd316-player audio{min-width:100%;height:34px}.sd316-library-hero h2{font-size:28px}}.sd316-trackrow{grid-template-columns:60px 1fr 70px}.sd316-slide{min-width:100%}.sd316-player{position:fixed;left:12px;right:12px;bottom:12px;background:linear-gradient(180deg,rgba(9,14,27,.76),rgba(7,11,22,.90));backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border:1px solid rgba(255,255,255,.10);box-shadow:0 18px 50px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.05);border-radius:26px;padding:14px 16px;display:grid;grid-template-columns:72px minmax(160px,240px) auto minmax(220px,1fr) auto;align-items:center;gap:14px;z-index:9999}.sd316-player-main{display:flex;align-items:center;gap:10px;min-width:0}.sd316-player audio{width:100%;min-width:0;height:40px;border-radius:999px;opacity:.95}.sd316-library-hero h2{font-size:28px}}
.sd316-smallbtn:hover{transform:translateY(-1px);background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.16)}
.sd316-player::before{content:"";position:absolute;inset:0;border-radius:26px;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.06),transparent 35%,transparent 65%,rgba(255,255,255,.03))}
.sd316-player>*{position:relative;z-index:1}