:root{color-scheme:light;--ink:#123e34;--gold:#a88035;--paper:#fbf8ef}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:19px/1.8 system-ui,sans-serif}a{color:inherit}button,input,select{font:inherit}button,.button{border:1px solid #b9c9bd;border-radius:12px;background:#fff;color:var(--ink);padding:10px 17px;cursor:pointer;text-decoration:none;min-height:48px}button:hover,.button:hover,button[aria-pressed=true]{background:#e5eee6;border-color:#617d69}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:3px}header{background:#123e34;color:#fff;padding:25px max(20px,calc((100vw - 1150px)/2)) 45px}header nav{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:16px}header h1{font-size:clamp(32px,5vw,56px);line-height:1.4;margin:28px 0 8px}header p{max-width:780px;color:#e8e3ce}main{max-width:1200px;margin:auto;padding:24px 16px}.intro{display:flex;gap:12px;flex-wrap:wrap}.intro .button:first-child{background:#a88035;color:white}.note{font-size:15px;color:#54695f}details{background:#fff;border:1px solid #d4dacd;border-radius:18px;margin:24px 0;padding:18px}summary{font-size:24px;font-weight:bold;cursor:pointer}#search{width:100%;border:1px solid #c4cec4;border-radius:12px;padding:14px;margin:18px 0}#surahs{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:9px}#surahs button{display:flex;align-items:center;justify-content:space-between;gap:7px;text-align:start}#surahs small{font-size:13px;color:#627667}.toolbar{position:sticky;top:0;z-index:2;background:#f9f7eff5;border:1px solid #d4dacd;border-radius:15px;padding:12px;display:flex;align-items:center;flex-wrap:wrap;gap:9px;box-shadow:0 3px 14px #123e3410}#pageJump{width:80px;padding:8px;border-radius:9px;border:1px solid #b9c9bd}.toolbar label{font-size:15px}#status{min-height:32px;color:#5a6c61}#pages{--zoom:100%;overflow-x:auto}figure{margin:25px auto;padding:14px 10px;background:white;border:1px solid #dce1d5;border-radius:15px;width:var(--zoom);max-width:none;min-width:min(100%,280px);box-shadow:0 4px 20px #123e3409}figure img{display:block;width:100%;height:auto;min-height:150px;background:#edf1e8}figcaption{font-size:15px;padding:10px 5px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}.error{color:#8b2929;padding:15px}.hide{display:none!important}#more{display:block;margin:25px auto}footer{text-align:center;padding:35px 18px;font-size:15px;border-top:1px solid #d7ddcf}body.night{--paper:#14251f;--ink:#e5eddf;color-scheme:dark}body.night details,body.night button,body.night .button,body.night .toolbar{background:#203a2f;color:#e5eddf}body.night .note,body.night #status{color:#c0cfbd}@media(max-width:600px){main{padding:14px 9px}.toolbar{padding:8px;gap:6px}.toolbar button{font-size:15px;padding:8px 11px}figure{padding:5px;margin:16px auto}#surahs{grid-template-columns:repeat(2,minmax(0,1fr))}header{padding:20px 18px 30px}}
[hidden]{display:none!important}figure{scroll-margin-top:145px}
.page-loading,.loading-hint{padding:14px 18px;border-radius:12px;background:#edf3e8;color:#244f3e;border:1px solid #cfddc6;font-size:17px}.page-loading::before{content:'◌';display:inline-block;margin-inline-end:9px;font-size:24px;vertical-align:middle;animation:page-spin 1.2s linear infinite}.supplement{border:2px solid #b08b48}.supplement img{max-width:900px;margin:auto}body.night .page-loading,body.night .loading-hint{background:#294737;color:#e8f0df}@keyframes page-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.page-loading::before{animation:none}}
figure img{cursor:zoom-in}.page-zoom-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:0;border:0;background:#eff2e8;color:#143e33;overflow:hidden}.page-zoom-dialog::backdrop{background:#0a211bea}.zoom-dialog-bar{display:flex;flex-wrap:wrap;gap:10px;padding:10px 16px;background:#123e34;color:white;min-height:70px}.zoom-dialog-bar button{color:#123e34}.zoom-dialog-scroll{overflow:auto;max-height:calc(100dvh - 85px);padding:15px;direction:ltr}.zoom-dialog-scroll img{display:block;max-width:none;height:auto;margin:0 auto;background:white}.page-zoom-dialog .page-loading{margin:10px 15px}.page-zoom-dialog img{touch-action:pan-x pan-y pinch-zoom}
