.lq-layout{display:grid;grid-template-columns:1fr;gap:2rem}
@media(min-width:1024px){.lq-layout{grid-template-columns:1fr 2fr}}
.lq-sidebar{max-height:70vh;overflow-y:auto}
.lq-sidebar::-webkit-scrollbar{width:4px}
.lq-sidebar::-webkit-scrollbar-thumb{background:var(--gold);border-radius:2px}
.qari-btn{width:100%;display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:.5rem;transition:all .3s;border:1px solid transparent;text-align:left;background:none;color:#fff}
.qari-btn.active{background:rgba(201,166,70,.15);border-color:rgba(201,166,70,.3)}
.qari-btn:not(.active):hover{background:rgba(255,255,255,.05)}
.qari-avatar{width:2.5rem;height:2.5rem;border-radius:50%;background:rgba(201,166,70,.1);display:flex;align-items:center;justify-content:center;color:var(--gold);flex-shrink:0}
.qari-avatar svg{width:1.25rem;height:1.25rem}
.qari-name{font-weight:500;font-size:.875rem;color:#fff}
.qari-style{color:rgba(255,255,255,.5);font-size:.75rem}
.surah-search{position:relative;margin-bottom:1rem}
.surah-search svg{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);width:1rem;height:1rem;color:rgba(255,255,255,.4)}
.surah-search input{padding-left:2.25rem;font-size:.875rem}
.surah-list{max-height:500px;overflow-y:auto}
.surah-btn{width:100%;display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:.5rem;transition:all .3s;border:1px solid transparent;text-align:left;background:none;color:#fff}
.surah-btn.active{background:rgba(201,166,70,.2);border-color:rgba(201,166,70,.3)}
.surah-btn:not(.active):hover{background:rgba(255,255,255,.05)}
.surah-num{width:2rem;height:2rem;border-radius:.25rem;background:rgba(201,166,70,.1);display:flex;align-items:center;justify-content:center;color:var(--gold);font-size:.875rem;font-weight:500;flex-shrink:0}
.surah-info{flex:1;min-width:0}
.surah-info .en{font-size:.875rem;font-weight:500;color:#fff}
.surah-info .ar{font-family:'Amiri',serif;color:var(--gold);font-size:.75rem}
.surah-verses{color:rgba(255,255,255,.4);font-size:.75rem;flex-shrink:0}
.player-card{padding:2rem}
.player-now{text-align:center;margin-bottom:2rem}
.player-now .ar{font-family:'Amiri',serif;font-size:2rem;color:var(--gold);margin-bottom:.5rem}
.player-now .en{font-size:1.25rem;font-weight:600;margin-bottom:.25rem;color:#fff}
.player-now .qari{color:rgba(255,255,255,.5);font-size:.875rem}
.player-progress{margin-bottom:1.5rem}
.player-bar{width:100%;height:.5rem;background:rgba(255,255,255,.1);border-radius:9999px;cursor:pointer;position:relative;overflow:hidden}
.player-bar .fill{height:100%;background:var(--gold);border-radius:9999px;transition:width .3s}
.player-times{display:flex;justify-content:space-between;margin-top:.5rem;font-size:.75rem;color:rgba(255,255,255,.5)}
.player-controls{display:flex;align-items:center;justify-content:center;gap:1.5rem}
.ctrl-btn{width:2.5rem;height:2.5rem;border-radius:50%;background:rgba(255,255,255,.05);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.7);transition:all .3s;border:none}
.ctrl-btn:hover{background:rgba(255,255,255,.1);color:var(--gold)}
.ctrl-btn svg{width:1.25rem;height:1.25rem}
.play-btn{width:4rem;height:4rem;border-radius:50%;background:var(--gold);display:flex;align-items:center;justify-content:center;color:var(--green);border:none;transition:all .3s}
.play-btn:hover{background:var(--gold-light);transform:scale(1.1)}
.play-btn svg{width:1.5rem;height:1.5rem}
.volume-ctrl{display:flex;align-items:center;gap:.75rem;margin-top:1.5rem;justify-content:center}
.volume-ctrl svg{width:1.25rem;height:1.25rem;color:rgba(255,255,255,.6)}
.volume-ctrl input[type="range"]{width:8rem;height:.25rem}