@font-face{font-family:Hafs;src:url('../data/HafsSmart.ttf') format('truetype');font-display:swap}
.voice-open{display:inline-flex;align-items:center;justify-content:center;flex:0 0 40px;width:40px;height:40px;border:1px solid var(--border);border-radius:50%;color:var(--green);margin-left:auto}
.voice-open:hover{background:var(--soft)}
#voice-dialog{width:min(560px,calc(100vw - 32px));max-height:85dvh;box-sizing:border-box;overflow:auto;background:var(--card);color:var(--ink);border:1px solid var(--border);border-radius:20px;padding:24px;box-shadow:0 24px 80px #0004}
#voice-dialog::backdrop{background:#071f1ac0;backdrop-filter:blur(4px)}
.voice-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.voice-heading h2{margin:0;font-size:21px}
#voice-description,#voice-status{font-size:14px;line-height:1.7}#voice-record{padding:12px 20px;background:var(--green);color:white;border:0;border-radius:24px}
#voice-record.listening{background:#dc2626;animation:voice-pulse 1.8s ease-in-out infinite}
@keyframes voice-pulse{50%{box-shadow:0 0 0 7px #dc262625}}
@media(prefers-reduced-motion:reduce){#voice-record.listening{animation:none}}
#voice-results{display:grid;gap:10px}.voice-result{display:grid;gap:9px;width:100%;padding:14px;border:1px solid var(--border);border-radius:12px;background:var(--soft);color:var(--ink);text-align:left;white-space:normal}
.voice-result:hover{border-color:var(--green)}.voice-result [lang=ar]{font-family:'Traditional Arabic','Segoe UI',serif;font-size:25px;line-height:1.8;text-align:right}
@media(max-width:400px){.recorder-main{gap:7px!important}.recitation-counts{gap:7px!important}.voice-open{flex-basis:34px;width:34px;height:34px}#voice-dialog{padding:18px}}
#word-info{position:fixed;z-index:20;width:max-content;max-width:min(360px,calc(100vw - 16px));max-height:calc(100vh - 16px);overflow:auto;white-space:pre-line;overflow-wrap:anywhere;pointer-events:none;background:var(--card);color:var(--ink);border:1px solid var(--border);border-radius:12px;padding:14px 16px;box-shadow:0 8px 32px #0003;font:13px/1.8 'Segoe UI',sans-serif;text-align:start}
.continuous-hint{flex:1;text-align:right;font-size:11px;color:var(--muted);margin-right:8px}
#record{position:relative;isolation:isolate}
#record.recording{box-shadow:0 0 0 var(--voice-glow,6px) #dc26261a}
#record.recording::before,#record.recording::after{content:'';position:absolute;inset:-4px;border:1.5px solid #ef4444;border-radius:50%;pointer-events:none;animation:mic-ripple 2.2s ease-out infinite}
#record.recording::after{animation-delay:1.1s}
@keyframes mic-ripple{0%{transform:scale(.95);opacity:.7}100%{transform:scale(1.5);opacity:0}}
@media(prefers-reduced-motion:reduce){#record.recording::before,#record.recording::after{animation:none;opacity:.3}}
@media(max-width:650px){.continuous-hint{display:none}}
.debug-panel{max-width:850px;margin:20px auto;padding:18px 20px;font-size:12px}
.debug-panel summary{cursor:pointer;color:var(--ink)}
.debug-panel p{font-size:11px;color:var(--muted);line-height:1.7}
.debug-actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.debug-actions button{border:1px solid var(--border);border-radius:7px;background:var(--soft);color:var(--ink);padding:8px 12px;font-size:12px}
#debug-output{display:block;box-sizing:border-box;width:100%;height:320px;resize:vertical;border:1px solid var(--border);border-radius:8px;padding:12px;background:var(--card);color:var(--ink);font:12px/1.7 Consolas,monospace;text-align:left;tab-size:2}
:root{font-family:'Segoe UI',sans-serif;font-synthesis:none;color:#253a32;background:#f5f6f2;--card:#fffefa;--ink:#253a32;--muted:#69766c;--border:#e0e5dc;--green:#215d49;--soft:#eef3ea;--amber:#9b631d;--paper:#fffdf8;--ornament:#9b967e;--quran-size:34px;color-scheme:light}
*{box-sizing:border-box}body{margin:0}button,select,input{font:inherit}button{cursor:pointer}button:disabled,select:disabled,input:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #b89f62;outline-offset:3px}a{color:inherit}button,select,input{min-height:40px}button{color:var(--ink)}[hidden]{display:none!important}
.header{position:relative;text-align:center;padding:20px 85px 12px}.bismillah{display:block;width:240px;max-width:100%;height:auto;margin:0 auto 9px}.brand{font-size:22px;font-weight:650;text-decoration:none;letter-spacing:-.7px}.brand span{font-weight:400}.header p{font-size:11px;color:var(--muted);margin:5px 0 0}.header #theme{position:absolute;right:66px;top:18px}.app-version{position:absolute;right:16px;top:21px;background:var(--card);color:var(--green);border:1px solid var(--border);border-radius:7px;padding:6px 9px;font-size:12px;font-weight:650}
main{max-width:1180px;padding:12px 28px 28px;margin:auto}.card{background:var(--card);border:1px solid var(--border);border-radius:13px}.practice{padding:20px 24px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}h1{font-family:Georgia,serif;font-weight:400;font-size:22px;margin:0}.private-badge{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--green);white-space:nowrap}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#56856b;vertical-align:middle}
label{display:block;font-size:9px;letter-spacing:1px;color:var(--muted);font-weight:650;margin-bottom:7px}.navigation{display:grid;grid-template-columns:1.4fr 1.1fr 1fr;gap:16px}.navigation>*{min-width:0}.input-group{display:flex;gap:5px}select,input:not([type=checkbox]){width:100%;min-width:0;border:1px solid var(--border);border-radius:7px;background:var(--card);color:var(--ink);font-size:12px;padding:9px}select{max-width:100%}.input-group button{border:1px solid var(--border);border-radius:7px;background:var(--soft);font-size:12px;padding:0 12px}#page{text-align:center;min-width:55px}#previous-page,#next-page{font-size:22px;padding:0 10px}.settings{display:grid;grid-template-columns:1fr .65fr .65fr 1.8fr 1.1fr auto;align-items:end;gap:14px;margin-top:17px}.settings>*{min-width:0}.segmented{display:flex;gap:3px;border-radius:8px;padding:3px;background:var(--soft)}.segmented button{flex:1;border:0;border-radius:6px;background:transparent;color:var(--muted);font-size:11px;min-height:34px;padding:7px}.segmented button[aria-pressed=true]{background:var(--card);color:var(--green);box-shadow:0 1px 4px #00000012}.toggle-row{display:flex;align-items:center;gap:7px;letter-spacing:0;font-weight:400;font-size:11px;margin:0;min-height:40px;white-space:nowrap}input[type=checkbox]{accent-color:var(--green);width:16px;min-height:16px;height:16px}.hint{color:var(--muted);font-size:11px;line-height:1.7}.practice>.hint{margin:8px 0 14px}
.recorder{border-top:1px solid var(--border);padding-top:16px}.recorder-main{display:flex;align-items:center;gap:18px}.record-button{display:flex;align-items:center;justify-content:center;gap:9px;background:var(--green);color:white;border:0;border-radius:9px;padding:12px 18px;font-size:12px;white-space:nowrap;min-height:46px}.record-button.recording{background:#844f3f}.record-button:hover:not(:disabled){filter:brightness(1.1)}.waveform{flex:1;display:flex;align-items:center;justify-content:center;gap:4px;height:38px;overflow:hidden}.waveform i{width:3px;min-width:3px;height:5px;border-radius:3px;background:#a6bca7;transition:height .09s}.session-stats{display:flex;gap:20px;font-size:10px;color:var(--muted);white-space:nowrap}.session-stats strong{font-size:15px;font-weight:500;color:var(--ink);font-variant-numeric:tabular-nums}.text-button,.icon-button{border:0;background:transparent;color:var(--muted);font-size:12px;padding:8px;border-radius:6px}.icon-button{min-width:38px;color:var(--ink)}.text-button:hover,.icon-button:hover{background:var(--soft)}progress{width:100%;height:4px;border:0;display:block;overflow:hidden;border-radius:4px;background:var(--soft);accent-color:var(--green)}progress::-webkit-progress-bar{background:var(--soft)}progress::-webkit-progress-value{background:var(--green)}progress::-moz-progress-bar{background:var(--green)}#progress{margin-top:15px}.status-row{display:flex;justify-content:space-between;align-items:baseline;gap:20px}#status{font-size:11px;line-height:1.7;color:var(--muted);margin:10px 0 0}#status.error{color:#b04437}.status-row .hint{margin:10px 0 0;text-align:right}#download{margin-top:12px}#model-picker p{font-size:12px;line-height:1.7}#model-file{max-width:100%}
.reader-toolbar{display:flex;align-items:center;justify-content:space-between;max-width:850px;margin:18px auto 7px;gap:10px}.reader-toolbar>span{font-size:9px;letter-spacing:1px;color:var(--muted)}.reader-toolbar>div{display:flex;align-items:center}.reader{max-width:850px;margin:0 auto 20px;background:var(--paper);border:1px solid var(--border);border-radius:7px;padding:0 30px;box-shadow:0 12px 35px #283a2607;overflow:hidden}.surah-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid var(--border);padding:18px 2px}.surah-heading h2{font-family:'Traditional Arabic',serif;font-size:22px;font-weight:400;margin:0;color:var(--muted)}.surah-heading p{font-size:11px;color:var(--muted);margin:0}.ayahs{position:relative;padding:20px 6px 28px;min-height:380px;max-height:820px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border) transparent;direction:rtl}.ayah{direction:rtl;text-align:center;padding:8px 4px;border-radius:8px;line-height:2.2;margin:4px 0}.ayah.current{background:var(--soft)}.mushaf-line{display:flex;align-items:baseline;justify-content:space-between;gap:2px;direction:rtl;line-height:2.1;white-space:nowrap}.opening-page .mushaf-line{justify-content:center;gap:6px}.word{font-family:Hafs,serif;font-size:var(--quran-size);line-height:inherit;min-height:0;border:0;background:transparent;color:var(--ink);padding:0 2px;border-radius:5px;position:relative;white-space:nowrap}.word.matched{color:var(--green)}.word.review{color:var(--amber);text-decoration:underline dotted;text-underline-offset:6px}.word.next{background:#b9d9c5;box-shadow:0 0 0 1px #92b69d}.word:hover{background:#acbba430}.word.concealed{color:transparent!important;text-decoration:none;user-select:none}.word.concealed:after{content:'';position:absolute;left:3px;right:3px;top:45%;height:9px;background:var(--border);border-radius:3px}.ayah-number{display:inline-grid;place-items:center;flex-shrink:0;border:1px solid var(--ornament);outline:1px solid var(--ornament);outline-offset:2px;border-radius:40%;font-size:12px;line-height:1;min-width:22px;height:24px;margin:0 7px;color:var(--ornament);vertical-align:middle}.mushaf-surah-header{text-align:center;position:relative;font-family:'Traditional Arabic',serif;font-size:27px;font-weight:400;border:3px double var(--ornament);border-radius:3px;margin:14px 6px 18px;padding:5px 40px;line-height:1.4}.mushaf-surah-header:before,.mushaf-surah-header:after{content:'✧';position:absolute;top:4px;color:var(--ornament);font-family:serif;font-size:25px}.mushaf-surah-header:before{right:12px}.mushaf-surah-header:after{left:12px}.page-bismillah{display:block;width:220px;max-width:65%;height:auto;margin:12px auto 20px}.reader-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid var(--border);padding:17px 0;font-size:9px;color:var(--muted)}.legend{display:flex;gap:12px;white-space:nowrap}.legend span{display:flex;gap:5px;align-items:center}.legend i{width:5px;height:5px;border-radius:50%}.green{background:#448566}.amber{background:#b58d45}.gray{background:#c1c6bb}.privacy-note{text-align:center;color:var(--muted);font-size:10px;line-height:1.7;margin:8px 0}.history{max-width:850px;margin:20px auto;padding:17px 20px;font-size:12px}.history summary{cursor:pointer}.history summary>span{float:right;font-size:10px;color:var(--muted)}.history-item{display:flex;justify-content:space-between;gap:15px;border-bottom:1px solid var(--border);padding:13px 0;font-size:11px}.history-item>span{color:var(--muted)}footer{text-align:center;color:var(--muted);font-size:10px;line-height:1.8;margin-top:24px}footer p{margin:5px}footer a{margin-left:8px}.loading{text-align:center;color:var(--muted);font-size:13px;padding:40px}
body.dark{--card:#1c2722;--paper:#15231b;--ink:#e3e8de;--muted:#a0afa2;--border:#34483a;--green:#8abc9b;--soft:#26392c;--amber:#e0b775;--ornament:#879880;background:#111c16;color:var(--ink);color-scheme:dark}.dark .record-button{background:#326c50}.dark .record-button.recording{background:#844f3f}.dark .word.next{background:#294e38;box-shadow:0 0 0 1px #739780}.dark .bismillah,.dark .page-bismillah{filter:brightness(0) invert(.9)}
@media(max-width:950px){.settings{grid-template-columns:1fr .65fr .65fr 1.5fr}.settings .toggle-row{grid-column:2/4}.session-stats{gap:12px}.waveform{max-width:180px}.navigation{grid-template-columns:1fr 1fr}.navigation #page-form{grid-column:1/-1;max-width:330px}.reader{padding:0 20px}}
@media(max-width:600px){main{padding:8px 10px 20px}.header{padding:18px 75px 10px}.bismillah{width:190px}.header p{font-size:9px}.header #theme{right:58px;top:15px}.app-version{right:10px;top:18px}.practice{padding:16px 13px}.section-heading{align-items:flex-start}h1{font-size:18px}.private-badge{font-size:9px;gap:4px}.navigation{grid-template-columns:1fr;gap:12px}.navigation #page-form{grid-column:auto;max-width:none}.settings{grid-template-columns:1fr 1fr 1fr;gap:12px 9px}.settings .mode{grid-column:1/3}.settings .toggle-row{grid-column:1/-1;min-height:24px}.recorder-main{flex-wrap:wrap;gap:10px}.record-button{flex:1}.waveform{flex:1;max-width:none}.waveform i:nth-child(n+20){display:none}.session-stats{order:2;width:100%;justify-content:center}.status-row{display:block}.status-row .hint{text-align:left;margin-top:3px}.reader{padding:0 11px}.surah-heading{padding:14px 0}.surah-heading h2{font-size:19px}.surah-heading p{font-size:10px}.ayahs{padding:10px 3px 24px;max-height:75vh}.mushaf-line{gap:1px}.mushaf-line .word{padding:0 1px}.ayah-number{margin:0 4px;min-width:17px;height:20px;font-size:10px}.reader-footer{flex-wrap:wrap;font-size:8px;gap:10px}.reader-toolbar>span{font-size:8px;letter-spacing:.5px}.mushaf-surah-header{font-size:24px}.history-item{flex-direction:column;gap:4px}.history summary>span{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* A single search field and a compact recitation bar. */
.header{padding-bottom:2px}.header .bismillah{margin-bottom:0}
.practice{max-width:850px;margin:0 auto;padding:18px 22px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.unified-search .input-group{position:relative;align-items:center;gap:0;background:var(--card);border:1px solid var(--border);border-radius:12px;overflow:hidden}
.unified-search .input-group:focus-within{outline:2px solid var(--green);outline-offset:2px}
.search-icon{flex-shrink:0;margin-left:15px;color:var(--muted)}
.unified-search #search{border:0;outline:none;background:transparent;padding:15px 12px;font-size:14px;min-height:52px}
.unified-search #search-go{flex-shrink:0;background:var(--soft);border:0;margin:6px;padding:0 15px;border-radius:8px;color:var(--green)}
.unified-search #search-go span{margin-left:7px;opacity:.6}
#search-hint{font-size:11px;color:var(--muted);line-height:1.9;margin:9px 2px 17px;text-wrap:pretty}
#search-hint strong{font-weight:600;color:var(--ink)}
.reader-toolbar{display:grid;grid-template-columns:1fr auto 1fr;gap:12px}
.reader-toolbar .page-navigation{display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;color:var(--muted)}
.reader-toolbar .visibility-toggle{justify-self:end;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid var(--border);border-radius:9px;transition:background .15s,color .15s}
.visibility-toggle span{display:flex;align-items:center;justify-content:center}
.visibility-toggle[aria-pressed=true]{background:var(--soft);color:var(--green);border-color:var(--green)}
.search-surah-row{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:center}
.search-surah-row .voice-open{margin:0;width:42px;height:42px;min-width:42px;border:1px solid var(--border);border-radius:12px;color:var(--green)}
.recorder-main #reset{margin-left:auto}
.search-surah-row>*{min-width:0}
.surah-picker select{height:54px;padding:12px;border-radius:12px;font-size:14px;direction:ltr}
.recorder-main{flex-wrap:nowrap}
.recorder-main .record-button{flex:0 0 48px;width:48px;height:48px;min-height:48px;padding:0;border-radius:50%}
.record-button.recording,.dark .record-button.recording{background:#dc2626;color:#fff;box-shadow:0 0 0 4px #dc26261a}
.recitation-counts{display:flex;align-items:center;gap:20px;white-space:nowrap;font-size:12px}
.recitation-counts strong{font-size:19px;font-weight:600;font-variant-numeric:tabular-nums;margin-right:4px}
.correct-count{color:var(--green)}.mistake-count{color:#b83232}.dark .mistake-count{color:#ff9292}
.session-meta{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);margin-top:7px;font-variant-numeric:tabular-nums}
.ayah-number{font-family:'Traditional Arabic','Noto Naskh Arabic','Segoe UI',serif}
.bismillah-line{display:flex;align-items:baseline;justify-content:center;gap:clamp(4px,1vw,10px);margin:8px 0 18px;direction:rtl}
.bismillah-line .word{font-family:'Traditional Arabic','Noto Naskh Arabic','Geeza Pro',serif;font-size:clamp(28px,4vw,40px);font-weight:400;line-height:1.9;padding:0 2px}
@media(max-width:600px){.practice{padding:14px 13px}.header{padding-bottom:0}.unified-search #search{font-size:13px;padding:13px 8px}.unified-search #search-go{padding:0 11px}.search-icon{margin-left:10px}#search-hint{font-size:10px;margin-bottom:13px}.reader-toolbar{grid-template-columns:1fr auto;gap:8px}.reader-status{display:none}.reader-toolbar .page-navigation{justify-self:start}.bismillah-line{gap:4px}}
@media(max-width:600px){.search-surah-row{gap:8px}.search-surah-row .search-icon{display:none}.search-surah-row #search{font-size:12px;padding:12px 7px}.search-surah-row #search-go{padding:0 8px;margin:5px}.search-surah-row #search-go span{display:none}.surah-picker select{font-size:12px;padding:10px 6px}.recorder-main{gap:12px}.recorder-main .waveform{display:none}.recitation-counts{flex:1;justify-content:center;gap:12px;font-size:11px}.recitation-counts strong{font-size:17px;margin-right:2px}.recorder-main #reset{padding:6px;font-size:11px}}
/* V14: keep navigation in the header and practice feedback in one compact row. */
.header{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:12px 16px 4px}
.header .bismillah{width:240px;max-width:100%;margin:0 auto}
.header #theme,.header .app-version{position:static}
.header .app-version{justify-self:end;white-space:nowrap}
.header .page-navigation{display:flex;align-items:center;gap:4px;white-space:nowrap;font-size:12px;color:var(--muted);direction:ltr}
.recorder{padding-top:10px}
.recorder-main{gap:14px}
.recorder-main .visibility-toggle{display:inline-flex;align-items:center;justify-content:center;flex:0 0 38px;width:38px;height:38px;padding:7px;border:1px solid var(--border);border-radius:9px}
.session-inline{flex:1;min-width:66px;max-width:220px;margin-left:2px}
.session-inline .session-meta{margin:0 0 5px;gap:8px;line-height:1.2}
.session-inline #progress{margin:0;height:3px}
.practice+.reader{margin-top:10px}
@media(max-width:600px){.header{gap:4px;padding:10px 10px 2px}.header .page-navigation{gap:0;font-size:10px}.header #next-page,.header #previous-page{min-width:28px;padding:0 6px}.header #theme{min-width:30px;padding:6px}.header .app-version{font-size:11px;padding:5px 7px}.recorder-main{gap:8px}.recorder-main .record-button{flex-basis:40px;width:40px;height:40px;min-height:40px}.recorder-main .recitation-counts{flex:0 0 auto;gap:9px;font-size:10px}.recorder-main .recitation-counts strong{font-size:16px}.recorder-main .visibility-toggle{flex-basis:32px;width:32px;height:34px;min-width:32px;padding:5px}.session-inline{min-width:48px;margin:0}.session-inline .session-meta{font-size:9px;gap:3px}}
@media(max-width:430px){.recorder-main #reset span{display:none}.recorder-main #reset{font-size:18px;padding:3px;min-width:24px}.recorder-main{gap:6px!important}.recorder-main .recitation-counts{gap:6px!important}}
/* Center navigation within the Mushaf heading, without adding another row. */
.header{display:block;padding:12px 100px 4px}
.header #theme{position:absolute;right:66px;top:12px}
.header .app-version{position:absolute;right:16px;top:15px}
.surah-heading{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:12px;padding:10px 2px}
.surah-heading h2{justify-self:start;min-width:0;overflow-wrap:anywhere}
.surah-heading p{justify-self:end;text-align:right;min-width:0}
.surah-heading .page-navigation{display:flex;align-items:center;justify-content:center;gap:4px;white-space:nowrap;font-size:12px;color:var(--muted);direction:ltr}
@media(max-width:600px){.header{padding:10px 85px 2px}.header #theme{right:54px;top:9px}.header .app-version{right:10px;top:12px}.surah-heading{gap:6px;padding:8px 0}.surah-heading .page-navigation{gap:0;font-size:11px}.surah-heading #next-page,.surah-heading #previous-page{min-width:30px;padding:0 6px}}
/* V16: natural word spacing and a full-height Mushaf with document scrolling. */
.reader{border:1px solid var(--ornament);border-radius:12px;box-shadow:0 8px 30px #283a2610,inset 0 0 0 4px var(--paper),inset 0 0 0 5px var(--border)}
.reader .ayahs{max-height:none;min-height:0;overflow:visible;padding:22px 10px 28px}
.mushaf-line,.opening-page .mushaf-line{justify-content:center;flex-wrap:wrap;column-gap:5px;row-gap:0;white-space:normal;line-height:1.95}
.mushaf-line .word{flex:0 0 auto;padding:0 2px}
.bismillah-line{flex-wrap:wrap;gap:5px}
.bismillah-line .word{font-size:var(--quran-size)}
.mushaf-heading-info{min-width:0}
.surah-heading .mushaf-heading-info p{text-align:left;margin-top:3px;font-size:10px;line-height:1.4}
.font-controls{display:flex;justify-self:end;gap:2px;border:1px solid var(--border);border-radius:9px;background:var(--paper)}
.font-controls button{min-width:34px;padding:6px;font-size:13px}
@media(max-width:600px){.reader .ayahs{padding:16px 3px 22px}.mushaf-line,.opening-page .mushaf-line{column-gap:3px;line-height:1.85}.font-controls button{min-width:30px;padding:5px;font-size:12px}.surah-heading .mushaf-heading-info p{font-size:9px}.surah-heading .mushaf-heading-info h2{font-size:17px}}
/* Disabled native inputs do not consistently receive pointer events. */
.search-surah-row{position:relative}
#search-lock-info{position:absolute;inset:0;z-index:2;width:100%;height:100%;border:0;border-radius:12px;padding:0;background:transparent;cursor:help}
#search-lock-info:focus-visible{outline:2px solid var(--green);outline-offset:3px}
#search-lock-tip{position:absolute;top:calc(100% + 7px);left:0;right:0;z-index:3;width:fit-content;max-width:100%;padding:10px 14px;background:var(--card);color:var(--ink);border:1px solid var(--border);border-radius:10px;box-shadow:0 6px 24px #0002;font-size:12px;line-height:1.6}
/* Temporary microphone-stop notice; does not move the Mushaf or take focus. */
#mic-notice{position:fixed;inset:auto 16px calc(20px + env(safe-area-inset-bottom)) auto;margin:0;z-index:100;width:min(390px,calc(100vw - 32px));display:flex;align-items:flex-start;gap:12px;padding:16px;border:1px solid var(--border);border-left:4px solid #dc2626;border-radius:12px;background:var(--card);color:var(--ink);box-shadow:0 10px 40px #0003;font:13px/1.6 'Segoe UI',sans-serif}
#mic-notice strong{font-size:14px}#mic-notice p{margin:4px 0 0}#mic-notice-close{flex:0 0 32px;min-width:32px;font-size:22px;padding:0;margin-left:auto}#mic-notice::backdrop{background:transparent;pointer-events:none}
/* Keep Reset, visibility, and text size together in that order. */
.practice-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto;margin-left:auto}
.recorder-main .practice-actions #reset{margin-left:0;white-space:nowrap}
.practice-actions .font-controls{flex:0 0 auto}
.surah-heading .page-navigation{grid-column:2;grid-row:1;flex-wrap:nowrap;justify-self:center}
#page-label{white-space:nowrap;flex-shrink:0}
@media(max-width:600px){.recorder-main{flex-wrap:wrap}.practice-actions{gap:6px}.recorder-main .session-inline{max-width:none}.surah-heading>h2{grid-column:1;grid-row:1}.surah-heading>p{grid-column:3;grid-row:1}}
/* Preserve printed line assignments and align ordinary lines to both margins. */
.mushaf-line,.opening-page .mushaf-line{flex-wrap:nowrap;white-space:nowrap;column-gap:3px;font-size:var(--quran-size);line-height:1.95}
.mushaf-line{justify-content:space-between}
.opening-page .mushaf-line{justify-content:center;column-gap:6px}
.mushaf-line .word{padding:0;flex:0 0 auto}
.mushaf-line .ayah-number{font-size:.36em;min-width:1.8em;width:auto;height:2em;margin:0 .5em;flex:0 0 auto}
.bismillah-line{flex-wrap:nowrap;white-space:nowrap}
@media(max-width:600px){.mushaf-line{column-gap:2px}.opening-page .mushaf-line{column-gap:4px}}
/* Keep examples beneath only the text-search column. */
.search-surah-row{row-gap:6px}
.search-surah-row #search-hint{grid-column:3;grid-row:2;margin:0 2px 12px;text-align:left;overflow-wrap:anywhere}
.search-surah-row #search-lock-info{bottom:auto;height:54px}
.search-surah-row #search-lock-tip{top:61px}
/* V26: compact examples, tracking accuracy, and optically centered navigation. */
.search-surah-row #search-hint{font-size:10px;line-height:1.5;margin-bottom:10px}
.accuracy-count{color:var(--ink)}
.recorder-main{flex-wrap:wrap}
.surah-heading .page-navigation{gap:6px;align-items:center;line-height:1}
.surah-heading #next-page,.surah-heading #previous-page{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;min-height:34px;min-width:34px;padding:0;border:1px solid var(--border);border-radius:50%;background:var(--soft)}
.page-navigation svg{display:block;flex-shrink:0}
#page-label{display:inline-flex;align-items:center;justify-content:center;height:34px;line-height:1;font-variant-numeric:tabular-nums}
.reader-footer{flex-wrap:wrap}
@media(max-width:600px){.search-surah-row #search-hint{font-size:10px}.surah-heading .page-navigation{gap:3px}.surah-heading #next-page,.surah-heading #previous-page{width:30px;min-width:30px;height:32px;min-height:32px}#page-label{height:32px}.recorder-main .recitation-counts{flex-wrap:wrap;row-gap:4px}}