.pg-entry,.pg-intro,.pg-sources{margin:20px 0}
.pg-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:16px 0}
.pg-tabs a{display:flex;flex-direction:column;gap:6px;padding:15px 10px;border:1px solid #d7e5dd;border-radius:15px;text-decoration:none;background:#f5f9f6;color:#234d3f;text-align:center}
.pg-tabs a.selected{background:#397a62;color:white}.pg-tabs small{font-size:12px}
.pg-counts,.pg-progress{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.pg-counts>*{padding:8px 12px;background:#edf4ef;border-radius:12px;color:#315f4b}
.pg-intro details{margin-top:12px}.pg-intro summary,.pg-outline summary,.pg-sources summary{cursor:pointer;color:#315f4b;padding:10px 0}
.pg-player{min-width:0;max-width:840px;margin-inline:auto}
.pg-full h2{margin:24px 0 12px}.pg-full-time{display:flex;justify-content:space-between;font-variant-numeric:tabular-nums;color:#456352;font-size:14px;margin:-12px 0 24px}.pg-transport.pg-full-controls{grid-template-columns:minmax(0,260px)}.pg-full-reset{display:block;margin:16px auto;background:transparent;border:0;color:#315f4b;font:inherit;min-height:44px;padding:8px 18px;cursor:pointer}.pg-full-reset:disabled{opacity:.45;cursor:default}.pg-full>.hint{text-align:center;margin-top:18px}
.pg-player progress{display:block;width:100%;height:5px;accent-color:#397a62;margin:14px 0 22px}
.pg-progress{justify-content:space-between;font-size:14px;color:#456352}
.pg-transport{display:grid;grid-template-columns:60px minmax(0,220px) 60px;gap:12px;justify-content:center;align-items:center}
.pg-transport button{font:inherit;cursor:pointer;min-height:52px;border:0;touch-action:manipulation}
.pg-toggle{border-radius:40px;background:#397a62;color:#fff;font-weight:600!important;padding:14px 12px;display:flex;gap:10px;align-items:center;justify-content:center}
.pg-toggle:hover{background:#2c664f}.pg-toggle span{font-size:16px}
.pg-skip{border-radius:14px;background:transparent;color:#315f4b;display:flex;flex-direction:column;align-items:center;line-height:1.1;gap:2px;padding:4px}
.pg-skip span{font-size:32px}.pg-skip small{font-size:12px}.pg-skip:hover{background:#edf4ef}
.pg-transport button:disabled{opacity:.45;cursor:default}
.pg-status{min-height:22px;margin:14px 0 4px!important;text-align:center;font-size:14px;color:#315f4b;overflow-wrap:anywhere}
.pg-timing{margin:0 0 22px!important;text-align:center;font-size:12px!important;color:#65796c}
.pg-reading{border-top:1px solid #e4ece6;padding-top:20px}.pg-reading h2{margin-top:0}
.pg-arabic{font-size:28px!important;line-height:2!important;text-align:right;padding:18px;background:#f7f9f5;border-radius:14px;overflow-wrap:anywhere}
.pg-translit{font-size:18px;line-height:1.8!important;overflow-wrap:anywhere}.pg-repeat{color:#397a62;font-weight:600}
.pg-outline{margin-top:22px;border-top:1px solid #e4ece6}.pg-outline ol{list-style:none;padding:0;max-height:380px;overflow:auto}
.pg-outline li button{width:100%;border:0;background:transparent;text-align:left;padding:12px;border-radius:9px;font:inherit;color:inherit;cursor:pointer;min-height:44px}
.pg-outline li button.selected{background:#edf4ef;color:#285640;font-weight:600}.pg-outline li small{white-space:nowrap;color:#687b70}
.pg-sources{max-width:840px;margin-inline:auto;font-size:14px}.pg-sources p{overflow-wrap:anywhere}
.pg-player button:focus-visible,.pg-player summary:focus-visible,.pg-intro summary:focus-visible,.pg-sources summary:focus-visible,.pg-tabs a:focus-visible{outline:3px solid #df8d63;outline-offset:3px}
@media(max-width:760px){.pg-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.pg-arabic{font-size:26px!important;padding:12px}.pg-counts{font-size:13px}.pg-player{padding:20px 16px!important}.pg-transport{grid-template-columns:48px minmax(0,1fr) 48px;gap:6px}.pg-toggle{font-size:14px!important;padding:14px 8px}.pg-progress{font-size:13px}.pg-status{font-size:13px}}
