/* Arabic / RTL layer on top of maarouf.css */
:root{--serif:'Instrument Serif','Readex Pro',sans-serif;--sans:'Geist','Readex Pro',sans-serif;--mono:'Geist Mono','Readex Pro',sans-serif}
*{letter-spacing:0!important}
body{line-height:1.8;font-weight:300}
h1,h2,h3,.lead,.cap,.eb{font-feature-settings:normal}
.eb{text-transform:none;font-family:'Readex Pro','Geist',sans-serif;font-weight:400;font-size:13px}
h1,h2,h3{font-family:'Instrument Serif','Readex Pro',sans-serif;font-weight:300;line-height:1.3}
/* Arabic sits smaller than Latin at the same size, so scale the display type up */
h2{font-size:clamp(34px,5vw,76px)}
h3{font-size:clamp(21px,2vw,30px)}
.cover h1{font-size:clamp(52px,8.5vw,128px);line-height:1.2}
.txt h2{font-size:clamp(38px,4.6vw,70px)}
.next h2{font-size:clamp(40px,6.6vw,100px);max-width:14ch}
.pr h3{font-size:clamp(20px,1.9vw,27px)}
.lead,.wall .head p,.cap,.next p,.mood p,.pr p,.ph3 p{font-family:'Readex Pro','Geist',sans-serif;font-weight:300}
.lead{font-size:clamp(15px,1.2vw,17px);line-height:2}
.cap{font-size:clamp(14px,1.1vw,16px);line-height:1.9}
.cap b,.move,.hud,.meter,.to,.trow figcaption,.tile figcaption,.mood .n,.txt .no{font-family:'Readex Pro','Geist Mono',sans-serif}
.cap b{font-size:13px;font-weight:500}
.move{font-size:13px;line-height:1.8}
.hud,.meter,.to,.trow figcaption,.tile figcaption{font-size:12.5px}
.sc{font-family:'Readex Pro',sans-serif;font-weight:400;color:inherit}
.cover .bar{font-family:'Readex Pro','Geist',sans-serif;font-size:12px;font-weight:300;text-transform:none}
.cover .sub p{font-family:'Readex Pro','Geist',sans-serif;font-size:clamp(15px,1.25vw,17px)}
#lbl{font-family:'Readex Pro','Geist',sans-serif;font-size:12.5px}
/* numerals stay in the display serif for a consistent look */
.big,.stats b,.todo b,.next .pct,.facts b{font-family:'Instrument Serif','Readex Pro',serif}
.facts b{font-family:'Instrument Serif','Readex Pro',sans-serif;font-weight:300;font-size:clamp(19px,1.8vw,25px);line-height:1.5}
.stats b{font-family:'Instrument Serif','Readex Pro',sans-serif;font-weight:300;font-size:clamp(28px,3vw,42px)}
.stats b:lang(en){font-family:'Instrument Serif',serif}
.todo b{font-size:30px}
.meter output,.txt .no,.mood .n{direction:ltr;unicode-bidi:isolate}
/* mirrored positions */
#prog{left:auto;right:0;transform-origin:100% 50%}
#rail{right:auto;left:clamp(14px,2.4vw,36px)}
.tile figcaption{left:auto;right:10px}
.mood .n{left:auto;right:12px}
.facts div{padding:18px 0 0 20px}
.facts div+div{padding:18px 20px 0 20px;border-left:0;border-right:1px solid rgba(113,140,105,.4)}
.stats div{padding:18px 0 22px 18px}
.stats div:nth-child(2n){padding:18px 18px 22px 0;border-left:0;border-right:1px solid rgba(113,140,105,.4)}
.men .row b{text-align:left}
.men .row i:after{left:auto;right:0}
.pr .b{text-align:left}
.ph3:after{left:auto;right:0}
.ph3 .st .hex{left:auto;right:0}
.meter i:after{left:auto;right:0}
/* reveal runs right to left */
/* reveal runs right to left (direction handled in JS via document.dir) */
.frame .rv,.frame .scw{transform:translate3d(100%,0,0)}.frame .rv .fa{transform:translate3d(-100%,0,0)}
.scan{right:auto;left:0}
.big small{margin-left:0;margin-right:.08em}
.todo div{text-align:right}
@media(max-width:900px){
 .facts div:nth-child(3){padding-right:0;border-right:0;padding-left:20px}
 .facts div:nth-child(4){padding-right:20px}
 .txt h2{font-size:38px}
 #rail{display:none}
}