/* Quiet reading studio: a compact shell around the original Quran page. */
:root{--studio-ink:#173f34;--studio-gold:#aa9660;--studio-line:#dfe5dc}
body{background:#eeefe8;color:var(--studio-ink)}
.app-header{height:68px;background:#fafbf6;color:#173f34;border-bottom:1px solid #dfe5db;box-shadow:none;padding:0 34px}.app-brand{font-size:23px;gap:10px}.brand-emblem{font-size:33px;color:#a99252}.app-brand small{font:10px Tahoma;color:#8e9c8a;margin-top:6px}.header-actions{gap:9px}.header-help,.index-toggle{border:1px solid #dce3d7;background:#f0f4e9;color:#355842;border-radius:12px;min-height:37px}.header-help{font-size:16px;width:37px}.index-toggle{display:flex;align-items:center;font-size:12px}.index-toggle span{font-size:14px}
.app-shell{max-width:1600px;grid-template-columns:232px minmax(0,1fr);gap:26px;padding:20px 34px 140px}.surah-section{background:#fafbf6;border:1px solid #dce3d7;border-radius:18px;box-shadow:none;padding:16px 11px 12px;top:20px;max-height:calc(100dvh - 225px)}.sidebar-top{padding:0 9px 16px}.sidebar-top h2{font-size:17px;margin:0}.sidebar-top h2 small{font-size:10px;color:#95a18c}.close-index{display:grid;place-items:center;background:#edf1e6;border:0;border-radius:9px;width:28px;height:28px;font-size:23px;color:#73886b}.search-wrap{background:#eef2e7;border:1px solid #e2e8da;border-radius:10px;padding:7px 9px;margin-bottom:10px}.search-wrap input{font-size:11px}.search-wrap kbd{display:none}.surah-grid{gap:4px;scrollbar-width:thin}.surah-card{padding:9px 8px;min-height:57px;border-radius:11px;transition:background .18s}.surah-card.selected{background:#e3ebd8;border-color:#d9e4cd}.surah-copy strong{font-size:14px;color:#234c39}.surah-copy small{font-size:9px;color:#98a38c}.surah-number{width:29px;height:29px;border-radius:9px;font-size:10px;background:#eef2e8;color:#8d9b7c}.selected .surah-number{background:#cdddbb;color:#40613d}.surah-action{background:#f2f6ed;width:25px;height:25px;display:grid;place-items:center;border-radius:50%;font-size:12px}.selected .surah-action{background:#244e3c;color:white}
.reading-panel,.reading-panel.mushaf-mode{background:transparent;border:0;border-radius:0;box-shadow:none;padding:0 14px 18px}.reader-head{padding:0 0 12px;border-bottom:1px solid #dce3d5;gap:15px}.section-eyebrow{font-size:10px;letter-spacing:1px;color:#a28f57}.reader-title-group h1{font-size:28px;line-height:1.1;margin:6px 0 0}.reader-actions{gap:7px}.view-switch,.mushaf-mode .view-switch{background:#e2e8db;border:0;border-radius:10px;padding:3px}.view-switch button{padding:7px 13px;font-size:11px}.view-switch button[aria-pressed=true],.mushaf-mode .view-switch button[aria-pressed=true]{background:#fffef8;color:#254c39;box-shadow:0 2px 6px #1a3f3010}.icon-action,.reading-settings>summary{min-height:34px;background:#f9fbf4;border:1px solid #d8e1cf;color:#4f6a4a;border-radius:10px;font-size:12px}.reading-settings>summary{width:35px;font-size:17px}.settings-menu{border-radius:15px;box-shadow:0 12px 45px #234a2d22}.settings-menu .reading-note{font-size:10px;line-height:1.8;margin:0;border-top:1px solid #e5eadf;padding-top:8px}
.mushaf-navigation,.mushaf-mode .mushaf-navigation{gap:10px;width:max-content;max-width:100%;margin:12px auto 0;background:#fafcf6;border:1px solid #dbe3d2;border-radius:14px;padding:5px;box-shadow:0 3px 10px #34472c04}.page-stepper{display:flex;align-items:center;gap:3px;border-left:1px solid #e2e8da;padding-left:8px}.mushaf-navigation button,.mushaf-mode .mushaf-navigation button{border:0;background:transparent;border-radius:9px;min-height:32px;font-size:11px;padding:6px 10px}.mushaf-navigation button:hover:not(:disabled){background:#edf3e5}.page-stepper button span{display:none}.page-stepper button{font-size:22px!important;padding:0 10px!important;min-width:30px}.mushaf-navigation input{background:#edf2e6;border:0;width:44px;padding:5px;font-size:11px}.mushaf-navigation label{font-size:10px}.page-total{display:none}.page-audio{gap:6px}.page-audio label{display:none}.page-audio select{border:0;background:transparent;padding:6px 5px;min-width:140px;max-width:220px;font-size:11px}.mushaf-navigation .page-audio button{background:#244d3b;color:#fff;padding:7px 14px;border-radius:10px}.mushaf-navigation .page-audio button:hover{background:#32644b}.mushaf-navigation #tafsir-page{color:#617d4b;background:#edf3e3}
.mushaf-sheet{margin:16px auto 8px;box-shadow:inset 0 0 0 6px #fffdf3,inset 0 0 0 7px #cbbb83,0 14px 32px #263b2715;border-color:#b6a26b;border-radius:3px}.text-credit{font-size:9px!important;color:#a3ad98!important;line-height:1.5}.mushaf-mode .text-credit{margin:6px 0 0}
.player{bottom:14px;left:50%;right:auto;transform:translateX(-50%);width:calc(100% - 48px);max-width:1320px;background:#fbfcf7f7;border:1px solid #dbe4d2;border-radius:20px;box-shadow:0 10px 45px #193a2518;backdrop-filter:blur(16px);overflow:visible}.player-inner{min-height:90px;padding:10px 24px;gap:22px;grid-template-columns:170px 230px minmax(240px,1fr) 104px}.player-track .track-icon{width:40px;height:40px;border-radius:12px;background:#e7efdd;color:#839a66}.player-track strong{font-size:12px}.player-track span:not(.track-icon){font-size:10px;color:#9aa58e}.player-selectors{gap:7px}.player-selectors label{font-size:9px;color:#8c9c7f}.player-selectors select{font-size:10px;padding:7px;background:#f0f5e9;border-color:#e1e8d8;border-radius:8px}.playback-buttons{gap:17px}.playback-buttons .play-button{height:40px;width:40px;background:#224d3b;box-shadow:0 4px 13px #224d3b20}.timeline{margin-top:8px;gap:9px;font-size:9px}.volume-control input{width:66px}.volume-control{gap:8px;font-size:13px}.hide-player{top:-12px;left:22px;border-radius:8px;border-color:#d8e2cf;width:30px;height:21px;font-size:16px;background:#f8fbf2}.status-line{bottom:119px;left:calc(50% - 120px);max-width:240px}.status-line #status:not(.error){display:none}.status-line #status.error{font-size:11px;padding:7px 12px;box-shadow:0 3px 15px #54271816}.show-player{border-radius:50%;width:43px;height:43px;padding:0;display:grid;place-items:center;font-size:17px;bottom:22px;left:24px}.show-player span{display:none}
body.player-hidden .player,body.mushaf-fullscreen:not(.controls-visible) .player:not(:focus-within){transform:translate(-50%,140%);opacity:0;pointer-events:none}.verse-action{top:auto;bottom:calc(var(--mushaf-player-height,100px) + 37px);z-index:60;border:1px solid #d1ddc5;background:#fcfdf8;box-shadow:0 10px 32px #1437242b;border-radius:15px;padding:9px 12px;gap:8px}.verse-action>div{padding:0 7px}.verse-action>div span{font-size:9px}.verse-action button{border-radius:10px;font-size:11px}.verse-action #verse-action-close{order:3}.player-hidden .verse-action{bottom:26px}
body.index-collapsed .app-shell{grid-template-columns:minmax(0,1fr);max-width:1250px}body.index-collapsed .surah-section{display:none}
.reading-panel.reading-night:not(.reading-expanded){background:#1c3328;border-radius:18px;padding:16px}.reading-night .reader-head{border-color:#40513b}
body.mushaf-fullscreen .player{bottom:12px}.reading-expanded .mushaf-navigation{border-color:#e1e7d6;top:12px;box-shadow:0 6px 20px #0002;padding:5px}.fullscreen-exit{border-radius:12px;font-size:11px}.reading-expanded .text-credit{display:none}
#tafsir-dialog{border-radius:22px;border-color:#d2ddc5;box-shadow:0 30px 120px #092a2050}.tafsir-head{background:#f3f6ec;padding:20px 26px;border-bottom:1px solid #e1e8d8}.tafsir-tools{padding-top:16px}#tafsir-verse{background:#efeddb;border-radius:10px;border-right:3px solid #b1a16a}#tafsir-body{color:#39513e;line-height:2.2}
@media(min-width:851px) and (min-height:720px){.reading-panel:not(.reading-expanded) .mushaf-sheet{width:min(100%,calc((100dvh - 320px) * .60));padding:19px 22px 10px}.reading-panel:not(.reading-expanded) .page-ornament{margin-top:7px;font-size:10px;line-height:15px}.reading-panel:not(.reading-expanded) .page-ornament span:first-child,.reading-panel:not(.reading-expanded) .page-ornament span:last-child{font-size:17px}}
@media(max-width:1100px){.app-shell{grid-template-columns:210px minmax(0,1fr);gap:16px;padding-inline:20px}.player-inner{grid-template-columns:140px 200px minmax(200px,1fr) 80px;gap:12px;padding-inline:17px}.volume-control input{width:45px}.page-audio select{min-width:110px;max-width:175px}.mushaf-navigation{gap:5px}.reader-actions{gap:5px}.icon-action{padding-inline:9px}}
@media(max-width:850px){.app-header{height:60px;padding-inline:17px}.app-brand{font-size:20px}.app-brand small{display:none}.brand-emblem{font-size:30px}.app-shell{display:block;padding:15px 12px 172px}.reading-panel,.reading-panel.mushaf-mode{padding:0 3px 15px}.reader-head{padding-bottom:12px}.reader-title-group h1{font-size:25px}.reader-title-group .section-eyebrow{font-size:9px}.icon-action{min-width:33px}.reader-actions .view-switch button{padding:7px 10px;font-size:10px}.view-switch{width:auto}.surah-section{top:68px;right:12px;left:12px;max-height:72dvh;box-shadow:0 20px 80px #132c2380;z-index:65}.surah-section.index-open{display:flex}.mushaf-navigation,.mushaf-mode .mushaf-navigation{flex-wrap:wrap;justify-content:center;gap:5px;padding:5px;margin-top:10px;border-radius:12px}.mushaf-navigation button{font-size:10px!important;padding:6px 9px!important}.page-stepper button{font-size:21px!important}.page-audio select{min-width:115px;max-width:165px}.mushaf-sheet{margin:12px auto 8px;max-width:590px;padding:20px 16px 10px}.player{width:calc(100% - 20px);bottom:10px;border-radius:17px}.player-inner{min-height:140px;grid-template-columns:1fr auto;gap:7px 12px;padding:12px 15px}.player-track{grid-column:1;grid-row:1}.player-track .track-icon{height:34px;width:34px}.playback-buttons{grid-row:1;grid-column:2}.player-selectors{grid-column:1/-1;grid-row:2;display:flex}.player-selectors label{flex:1}.timeline{grid-column:1/-1;grid-row:3;margin-top:2px}.volume-control{display:none}.verse-action{max-width:calc(100vw - 20px);bottom:calc(var(--mushaf-player-height,145px) + 28px)}.reading-expanded .mushaf-navigation{max-width:calc(100vw - 70px)}.settings-menu{left:0;width:220px}.index-toggle{font-size:11px;padding-inline:9px}.header-help{width:34px}.status-line{bottom:167px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}
