/* Kuran hatmi: Haremeyn study-card visual language; scoped to this reader. */
:root{--kuranGold:#cba254;--kuranPaper:#f4ecd9}
body{background:#eee8dc!important;color:#372d1b!important}
header{background:#f7f0dc!important;color:#47331d!important;border-bottom:2px solid #bd9145}
header .wrap{max-width:1030px!important}
header h2{font-size:19px!important}
header form{align-items:center}
header input,header select,header button{background:#fffaf0;color:#332718;border-color:#bc9d5b}
.wrap{max-width:1000px!important}
.page{background:var(--kuranPaper)!important;border:2px solid #d0b173!important;border-radius:9px!important;padding:9px 10px 145px!important;min-height:68vh!important}
.page .ayah{position:relative;background:#f4ecd9!important;border:2px solid #ceac66!important;border-radius:11px!important;margin:9px 1px!important;padding:16px 14px!important;direction:rtl;scroll-margin-top:160px}
.page .ayah .arab{display:block!important;font-size:35px!important;line-height:2.65!important;text-align:right!important;color:#17130f!important;word-spacing:2px}
.page .ayah .qword{display:inline-block!important;position:relative!important;vertical-align:top!important;padding:6px 5px 12px!important;margin:2px 2px 17px!important;border-radius:9px!important;min-height:55px!important;transition:background-color .07s}
.page .ayah .qword .word-tr{display:block!important;position:absolute!important;top:90%;left:50%;transform:translateX(-50%) rotate(-5deg);font:italic 600 12px/1.2 system-ui!important;white-space:nowrap!important;max-width:none!important;color:#554838!important}
.page .ayah .qword.reading{background:#ffe08a!important;box-shadow:0 0 0 2px #deb13a!important;color:#15110b!important}
.page .ayah .num{display:block!important;direction:ltr!important;text-align:left!important;color:#463b29!important;font-size:13px!important;font-weight:800!important;margin-top:9px}
.page .ayah.selected,.page .ayah.auto-follow{outline:2px solid #d0ab59!important;background:#f6edd9!important}
.page .ayah .hb-ayah-tools{direction:ltr;display:flex;justify-content:flex-start;flex-wrap:wrap;gap:7px;margin:7px 0}
.page .ayah .hb-ayah-tools button{border:1px solid #cfa55b!important;border-radius:999px!important;padding:5px 11px!important;background:#fffaf0!important;color:#125e45!important;font-weight:700}
.page .ayah .hb-ayah-detail{direction:ltr;text-align:left;background:#fffaf0;border-left:3px solid #b98d38;padding:12px;border-radius:6px;line-height:1.7}
.page .ayah .warn{display:block;font-size:11px!important;font-weight:500!important;opacity:.65;margin-top:4px}
.page .ayah[data-state=invalid]{border:2px solid #bc5858!important}
.page .ayah[data-state=missing]{border:2px solid #caa967!important}
.page .ayah[data-state=overlap],.page .ayah[data-state=candidate]{border:2px solid #ceac66!important}
.problem-head{display:none!important}
.nav{background:#fff8e9!important;border:1px solid #d5bf8f!important}
.dock{background:#fffaf0!important;border-top:2px solid #b68c43!important;box-shadow:0 -7px 26px #30210f19!important;max-height:44vh!important;padding:7px 8px!important}
.dock>div{max-width:1000px!important}
.dock #now{display:block;color:#382d22;font-size:13px;margin-bottom:3px}
#haremeynControls{background:transparent!important;border:none!important;margin:2px 0!important;padding:2px!important}
.hbctrl{justify-content:center!important;gap:5px!important}
.hbctrl button{background:#fdf8ed!important;color:#3a2d1e!important;border:1px solid #d1b88a!important;border-radius:999px!important;font-size:12px!important}
#hbWaveScroll{background:#f7efdf!important;border:0!important;min-height:56px!important}
#hbWaveContent{height:55px!important}
#hbWaveBars i{background:#a78d65!important}
#hbWaveCursor{background:#7f2628!important}
.hbtime{font-size:11px}
#kuranPosition{max-width:1000px;margin:12px auto 3px;background:#fffaf0;border:1px solid #cba65e;border-radius:10px;padding:10px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;color:#392c19}
#kuranPosition .kuran-info{font-size:16px;font-weight:850}
#kuranPosition button{background:#3f362a;color:#fffaf0;border:0;border-radius:999px;padding:9px 13px;font-weight:800;cursor:pointer}
#kuranPosition .kuran-bookmark{background:#185d49}
#kuranSaved{max-width:1000px;margin:8px auto 4px;padding:17px;border:2px solid #c6a45e;border-radius:11px;background:#fff5d8;display:none;align-items:center;gap:15px;flex-wrap:wrap}
#kuranSaved.visible{display:flex}
#kuranSaved strong{font-size:clamp(19px,3vw,28px);color:#523a1b;flex:1}
#kuranSaved button{border:1px solid #a8894d;border-radius:7px;background:#fffdf6;padding:10px;font-weight:800}
@media(max-width:650px){.page{padding:5px 4px 145px!important}.page .ayah{padding:8px 6px!important}.page .ayah .arab{font-size:29px!important;line-height:2.7!important}.page .ayah .qword{margin:1px 2px 18px!important;padding:5px 2px 10px!important}.page .ayah .qword .word-tr{font-size:10px!important}#kuranPosition{margin:6px 7px;gap:7px}#kuranSaved{margin:6px 7px}.dock{max-height:49vh!important}}
/* This is the original Haremeyn-style handwritten translation under the Arabic word. */
.page .ayah .qword.has-kirik{margin-bottom:29px!important;padding-bottom:14px!important}
.page .ayah .hbq-kirik-note{position:absolute!important;left:50%;top:calc(100% - 3px);transform:translateX(-50%) rotate(-6deg);direction:ltr;unicode-bidi:isolate;font:italic 600 12px/1.05 system-ui!important;white-space:nowrap!important;color:#453524!important;text-align:center;z-index:3;pointer-events:none}
.page .ayah .qword.reading .hbq-kirik-note{background:#ffe58a!important;padding:2px;border-radius:4px}
#hbqHaramainKirikCtl{position:fixed;top:74px;right:10px;z-index:8;background:#fff6db;border:1px solid #cba65e;border-radius:12px;display:flex;align-items:center;gap:5px;padding:5px 8px;font-weight:800;box-shadow:0 4px 12px #36270a26}
#hbqHaramainKirikCtl button{background:#fffdf6;border:1px solid #cba65e;border-radius:7px;padding:2px 8px}
@media(max-width:650px){.page .ayah .hbq-kirik-note{font-size:10px!important}#hbqHaramainKirikCtl{top:62px;right:5px;font-size:10px}}

/* Current mushaf position remains accessible while the text scrolls. */
#kuranPosition{position:sticky!important;top:var(--kuran-header-height,100px)!important;z-index:8!important;margin-top:0!important;box-shadow:0 4px 12px #251a0a26}
#kuranSaved.visible{position:fixed!important;top:calc(var(--kuran-header-height,100px) + 58px);left:50%;transform:translateX(-50%);width:min(94vw,960px);z-index:14;box-shadow:0 10px 35px #251a0a40}
@media(max-width:650px){#kuranPosition{padding:5px 8px!important;gap:4px!important}#kuranPosition .kuran-info{font-size:12px!important}#kuranPosition button{padding:5px 8px!important;font-size:11px!important}#kuranSaved.visible{top:calc(var(--kuran-header-height,100px) + 48px)}}
