.rbt-card{display:flex;flex-direction:column;background-color:#fff;padding:1rem;border:1px solid #e5e7eb;border-radius:.5rem;box-shadow:0 1px 2px #0000000d;transition:box-shadow .2s}.rbt-card:hover{box-shadow:0 4px 6px #0000001a}.image-container{position:relative;padding-bottom:56.25%;width:100%;overflow:hidden;border-radius:.375rem;margin-bottom:.75rem}.image-container img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.rbt-title{font-size:1.5rem;font-weight:800;color:#1a1a1a;margin:0;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:-.02em}.rbt-artists{font-size:1rem;color:#4caf50;font-weight:600;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0;padding:0}.rbt-audio{width:100%;margin-bottom:.75rem}.stats-container{display:flex;align-items:center;gap:1rem;margin-top:auto;padding-top:.5rem;font-size:.875rem;color:#6b7280}.stat{display:flex;align-items:center;gap:.25rem}.stat-icon{width:1rem;height:1rem}.rbt-page{padding:1.5rem .75rem;max-width:90%;margin:0 auto}.page-title{font-size:2.25rem;font-weight:600;margin-bottom:2.5rem;color:#111827}.rbt-grid{display:grid;grid-template-columns:repeat(1,1fr);gap:1.5rem}@media (min-width: 768px){.rbt-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1024px){.rbt-grid{grid-template-columns:repeat(3,1fr)}}.loading-state{padding:2rem;text-align:center}.error-state{padding:2rem;text-align:center;color:#ef4444}@media (prefers-color-scheme: dark){.rbt-card{background-color:#1f2937;border-color:#374151}.rbt-title{color:#f3f4f6}.rbt-artists{color:#6fcf97}.stats-container{color:#9ca3af}}.custom-audio-player{display:flex;align-items:center;gap:16px;width:100%;margin-top:.5rem}.play-pause-button{width:48px;height:48px;background-color:#4caf50;border:2px solid #43a047;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;flex-shrink:0;box-shadow:none;transition:transform .2s ease,background-color .2s ease}.play-pause-button:hover{transform:scale(1.05);background-color:#43a047}.play-pause-button:active{transform:scale(.98)}.play-pause-button svg{width:24px;height:24px}.progress-container{position:relative;height:6px;flex-grow:1;background-color:#e0e0e0;border-radius:3px;margin:0 8px;cursor:pointer}.progress-fill{position:absolute;top:0;height:100%;width:var(--progress-percent, 0%);background-color:#4caf50;border-radius:3px}[dir=ltr] .progress-fill{left:0}[dir=rtl] .progress-fill{right:0}.progress-thumb{position:absolute;top:50%;width:16px;height:16px;border-radius:50%;background-color:#4caf50;transform:translateY(-50%);box-shadow:0 1px 3px #0000004d;pointer-events:none}[dir=ltr] .progress-thumb{left:calc(var(--progress-percent, 0%) - 8px)}[dir=rtl] .progress-thumb{right:calc(var(--progress-percent, 0%) - 8px)}.time-display{font-size:.875rem;color:#757575;min-width:50px;font-weight:500}[dir=ltr] .time-display{text-align:right}[dir=rtl] .time-display{text-align:left}.hidden-audio{display:none}[dir=ltr] .progress-bar::-webkit-slider-runnable-track{background:linear-gradient(to right,#4CAF50 var(--progress-percent, 0%),#e0e0e0 var(--progress-percent, 0%))}[dir=rtl] .progress-bar::-webkit-slider-runnable-track{background:linear-gradient(to left,#4CAF50 var(--progress-percent, 0%),#e0e0e0 var(--progress-percent, 0%))}[dir=ltr] .progress-bar::-moz-range-track{background:linear-gradient(to right,#4CAF50 var(--progress-percent, 0%),#e0e0e0 var(--progress-percent, 0%))}[dir=rtl] .progress-bar::-moz-range-track{background:linear-gradient(to left,#4CAF50 var(--progress-percent, 0%),#e0e0e0 var(--progress-percent, 0%))}.rbt-card-horizontal{display:flex;background-color:#fff;border:2px solid #e5e7eb;border-radius:.75rem;box-shadow:none;overflow:hidden;margin-bottom:1.75rem;width:100%;padding:1.5rem;transition:border-color .2s ease}.rbt-card-horizontal:hover{border-color:#d1d5db;box-shadow:none}.rbt-image{width:200px;height:200px;flex-shrink:0;border-radius:.5rem;overflow:hidden;border:1px solid #e5e7eb;box-shadow:none}[dir=ltr] .rbt-image{margin-right:2rem}[dir=rtl] .rbt-image{margin-left:2rem}.rbt-image img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.rbt-image-placeholder{width:100%;height:100%;background-color:#f3f4f6}.rbt-content{flex-grow:1;min-width:0;display:flex;flex-direction:column;justify-content:space-between}.rbt-header{display:flex;align-items:flex-start;gap:1.5rem;margin-bottom:1.5rem;position:relative;padding-top:.5rem}.rbt-main-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:.75rem;margin-top:1.5rem}[dir=ltr] .rbt-main-info{padding-right:1rem}[dir=rtl] .rbt-main-info{padding-left:1rem}.rbt-description{width:auto;min-width:200px;max-width:350px;font-size:.9rem;color:#4b5563;line-height:1.6;padding:1rem 1.25rem;background-color:#f8fafc;border-radius:.75rem;border:1px solid #e2e8f0;align-self:flex-start;flex-shrink:0;position:relative;box-shadow:0 2px 4px #0000000d;margin-top:.5rem;white-space:pre-wrap;word-wrap:break-word;max-height:-moz-fit-content;max-height:fit-content;min-height:60px;transition:all .2s ease}[dir=ltr] .rbt-description{margin-left:auto}[dir=rtl] .rbt-description{margin-right:auto}.rbt-description:hover{background-color:#f1f5f9;box-shadow:0 4px 6px #00000012}.rbt-description::-webkit-scrollbar{width:4px}.rbt-description::-webkit-scrollbar-track{background:#f1f5f9;border-radius:2px}.rbt-description::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:2px}.rbt-description::-webkit-scrollbar-thumb:hover{background:#94a3b8}.rbt-list{display:flex;flex-direction:column;gap:1.5rem}.page-title{font-size:2rem;font-weight:800;margin-bottom:2rem;color:#111827}.loading-state,.error-state{padding:2rem;text-align:center}.error-state{color:#ef4444}@media (prefers-color-scheme: dark){.rbt-card-horizontal{background-color:#fff;border-color:#d1d5db}.rbt-title{color:#111827}.rbt-artists{color:#9ca3af}.rbt-image{border-color:#d1d5db}.rbt-image-placeholder{background-color:#f3f4f6}}@media (max-width: 768px){.rbt-card-horizontal{flex-direction:column;padding:1rem}.rbt-image{width:100%;height:auto;aspect-ratio:1;margin-bottom:1rem}[dir=ltr] .rbt-image{margin-right:0}[dir=rtl] .rbt-image{margin-left:0}.rbt-header{flex-direction:column;gap:1rem}.rbt-main-info{margin-top:0}[dir=ltr] .rbt-main-info{padding-right:0}[dir=rtl] .rbt-main-info{padding-left:0}.rbt-description{width:100%;max-width:100%;margin:1rem 0 0}.rbt-title{font-size:1.25rem}.rbt-artists{font-size:.875rem}.play-pause-button{width:40px;height:40px}.play-pause-button svg{width:20px;height:20px}.time-display{font-size:.75rem}}@media (max-width: 640px){.rbt-page{padding:1rem .5rem;max-width:100%}.page-title{font-size:1.5rem;margin-bottom:1.5rem}.rbt-card-horizontal{padding:.75rem}.rbt-description{font-size:.8rem;padding:.75rem 1rem}.play-pause-button{width:56px;height:56px;margin:0 auto}.play-pause-button svg{width:28px;height:28px}.progress-container{height:12px;margin:1rem 0}.progress-thumb{width:24px;height:24px}[dir=ltr] .progress-thumb{left:calc(var(--progress-percent, 0%) - 12px)}[dir=rtl] .progress-thumb{right:calc(var(--progress-percent, 0%) - 12px)}.custom-audio-player{gap:1rem}}.pagination-controls{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:2rem;margin-bottom:2rem;flex-wrap:wrap}.pagination-button{background-color:#fff;border:2px solid #e5e7eb;border-radius:.75rem;padding:.625rem 1.25rem;font-weight:600;color:#111827;transition:border-color .2s ease;cursor:pointer}.pagination-button:hover:not(:disabled){border-color:#d1d5db}.pagination-button:disabled{opacity:.5;cursor:not-allowed}.pagination-info{font-size:1rem;font-weight:500;color:#6b7280}.pagination-numbers{display:flex;align-items:center;gap:.5rem}.page-number{min-width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;background-color:#fff;border:2px solid #e5e7eb;border-radius:.5rem;font-weight:600;color:#111827;transition:all .2s ease;cursor:pointer}.page-number:hover{border-color:#d1d5db}.page-number.active{background-color:#4caf50;border-color:#43a047;color:#fff}.page-ellipsis{padding:0 .5rem;color:#6b7280}@media (max-width: 640px){.pagination-controls{flex-direction:column;gap:1rem}.pagination-info{order:-1}.pagination-numbers{flex-wrap:wrap;justify-content:center}.page-number{min-width:2rem;height:2rem;font-size:.875rem}}