.q-controls{display:flex;align-items:center;gap:10px 12px;max-width:760px;margin-inline:auto}.q-controls .q-search{flex:1 1 0;min-width:0;max-width:none}@media(max-width:400px){.q-controls{gap:8px}.q-view button{width:38px}.q-input{padding-inline-end:8px;text-overflow:ellipsis}}.q-arrow{flex:none;color:var(--primary)}:root[dir=rtl] .q-arrow{transform:scaleX(-1)}.q-bar{display:flex;flex:none;align-items:center;gap:10px 12px;margin:0}.q-seg{display:flex;flex:1 1 200px;gap:4px;padding:4px;border:1px solid var(--border);border-radius:999px;background:var(--surface)}.q-seg button{flex:1 1 0;min-height:42px;padding:0 12px;border:0;border-radius:999px;background:transparent;color:var(--text-2);font:inherit;font-weight:800;font-size:.92rem;white-space:nowrap;cursor:pointer;transition:background .15s ease,color .15s ease}.q-seg button:hover{color:var(--text);background:var(--primary-light)}.q-seg button[aria-pressed=true]{background:var(--primary);color:var(--on-primary)}.q-view{flex:none}.q-view button{min-height:46px}.q-view button{flex:none;width:42px;padding:0;display:grid;place-items:center}.q-view svg{width:20px;height:20px}.q-seg button:focus-visible,.q-pill:focus-visible{outline:3px solid var(--gold);outline-offset:2px}.q-juz{display:flex;align-items:flex-start;gap:10px;margin-top:12px}.q-juz-label{flex:none;line-height:42px;font-weight:800;font-size:.9rem;color:var(--text-2)}.q-juz-track{display:flex;gap:6px;min-width:0;padding:0 2px 6px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin}.q-pill{flex:none;min-width:42px;height:42px;padding:0 12px;border-radius:12px;border:1px solid var(--border);background:var(--surface);color:var(--text);font:inherit;font-weight:800;font-size:.92rem;font-variant-numeric:tabular-nums;cursor:pointer;scroll-snap-align:center;transition:background .15s ease,border-color .15s ease,color .15s ease}.q-pill:hover{border-color:var(--primary)}.q-pill[aria-pressed=true]{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}@media(min-width:720px){.q-juz-track{flex-wrap:wrap;overflow:visible;gap:5px;padding-bottom:0}.q-pill{min-width:36px;height:38px;padding-inline:6px;border-radius:10px;font-size:.88rem}.q-juz-label{line-height:38px}}.q-head{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin:22px 0 14px}.q-head:has(.q-count[hidden]){margin:4px 0 8px}.q-head .q-h2{margin:0}.q-count{padding:3px 12px;border-radius:999px;background:var(--primary-light);color:var(--primary);font-weight:800;font-size:.92rem;font-variant-numeric:tabular-nums}.q-count[hidden]{display:none}.surah-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:12px;margin-top:clamp(28px,5vw,48px);margin-bottom:clamp(48px,8vw,96px)}[data-view=list] .surah-grid{grid-template-columns:minmax(0,1fr);gap:6px;max-width:920px}.surah-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"no main ar" "no facts ar";align-items:center;column-gap:14px;row-gap:3px;padding:14px 16px;border-radius:var(--radius-lg);transition:border-color .15s ease,transform .15s ease,background .15s ease,box-shadow .15s ease}.surah-card[hidden]{display:none}.surah-card:hover{background:var(--primary-light);background:color-mix(in srgb,var(--primary) 9%,var(--surface));box-shadow:var(--shadow)}.surah-card:active{transform:scale(.985)}.surah-card:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-color:var(--primary)}.surah-no{grid-area:no;position:relative;width:52px;height:52px;display:grid;place-items:center;border:0;border-radius:0;background:none;transform:none;color:var(--primary)}.surah-no:before,.surah-no:after{content:"";position:absolute;z-index:0;transition:background .15s ease,opacity .15s ease;-webkit-mask:var(--q-star) center / 100% 100% no-repeat;mask:var(--q-star) center / 100% 100% no-repeat}.surah-no:before{inset:0;background:var(--primary);opacity:.4}.surah-no:after{inset:2.5px;background:var(--primary-light)}.surah-no b{position:relative;z-index:1;font-size:.95rem;font-weight:800;font-variant-numeric:tabular-nums;line-height:1}.surah-card:hover .surah-no:before,.surah-card:focus-visible .surah-no:before{opacity:1}.surah-card:hover .surah-no:after,.surah-card:focus-visible .surah-no:after{background:var(--primary)}.surah-card:hover .surah-no,.surah-card:focus-visible .surah-no{color:var(--on-primary)}:root{--q-star: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon points='50,0.5 64.5,14.9 85,15 85.1,35.5 99.5,50 85.1,64.5 85,85 64.5,85.1 50,99.5 35.5,85.1 15,85 14.9,64.5 0.5,50 14.9,35.5 15,15 35.5,14.9'/%3E%3C/svg%3E")}.surah-main{grid-area:main;min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:0 8px;line-height:1.3}.surah-name{font-size:1.18rem;font-weight:800;letter-spacing:-.005em;overflow-wrap:anywhere}.surah-name--ar{font-family:var(--font-quran);font-weight:400;font-size:1.9rem;line-height:1.6;color:var(--gold)}.surah-mean{color:var(--text-2);font-weight:600;font-size:.9rem}.surah-facts{grid-area:facts;display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;color:var(--text-2);font-weight:600;font-size:.86rem}.surah-tag{display:inline-flex;align-items:center;gap:6px;padding:2px 10px;border-radius:999px;font-size:.76rem;font-weight:800;line-height:1.5;letter-spacing:.01em}.surah-tag:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.surah-tag--meccan{color:var(--gold);background:#d9b26f29;background:color-mix(in srgb,var(--gold) 14%,transparent)}.surah-tag--medinan{color:var(--primary);background:var(--primary-light);background:color-mix(in srgb,var(--primary) 14%,transparent)}.surah-ar{grid-area:ar;font-family:var(--font-quran);font-size:1.95rem;line-height:1.6;color:var(--gold);white-space:nowrap;text-align:end}[data-view=list] .surah-card{padding:8px 12px;column-gap:12px;row-gap:0;border-radius:var(--radius)}[data-view=list] .surah-card:hover{transform:none;box-shadow:none}[data-view=list] .surah-no{width:42px;height:42px}[data-view=list] .surah-no b{font-size:.85rem}[data-view=list] .surah-name{font-size:1.05rem}[data-view=list] .surah-name--ar,[data-view=list] .surah-ar{font-size:1.6rem;line-height:1.5}@media(min-width:700px){[data-view=list] .surah-card{grid-template-columns:44px minmax(0,1fr) 230px 170px;grid-template-areas:"no main facts ar";padding-inline:16px}[data-view=list] .surah-facts{flex-wrap:nowrap}[data-view=list] .surah-verses{min-width:5.5rem}}.surah-card--noar{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"no main facts"}.surah-card--noar .surah-facts{flex-direction:column;align-items:flex-end;gap:4px}@media(min-width:700px){[data-view=list] .surah-card--noar{grid-template-columns:44px minmax(0,1fr) 230px}[data-view=list] .surah-card--noar .surah-facts{flex-direction:row;align-items:center;gap:4px 10px}}@media(max-width:480px){.surah-card{column-gap:12px;padding:12px 14px}.surah-name--ar,.surah-ar{font-size:1.7rem}[data-view=list] .surah-name--ar,[data-view=list] .surah-ar{font-size:1.45rem}.q-seg button{padding-inline:8px;font-size:.88rem}}@media(prefers-reduced-motion:reduce){.surah-card:hover,.surah-card:active{transform:none}}