/* Aroub Soubh · September 2026 refinement. Her artwork remains untouched. */
:root{--ease-out:cubic-bezier(.16,1,.3,1)}
html{scroll-padding-top:calc(var(--hb,76px) + 26px)}
h1,h2,h3{text-wrap:balance}
p,figcaption{text-wrap:pretty}
button,a{-webkit-tap-highlight-color:transparent}
button{font-family:inherit}
:focus-visible{outline:3px solid var(--ink);outline-offset:5px}
.entrance{height:420svh}
.lead .cue{gap:12px}
.cue .pulse{border-color:var(--eye)}
.cue .pulse i{background:var(--eye)}
.entry-caption{font-size:15px;line-height:1.5;max-width:27ch;color:var(--muted);margin:18px 0 0}
.entry-direct{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:14px;text-decoration:none;border-bottom:1px solid var(--rule);margin-top:10px}
.entry-direct::after{content:'↗';font-size:18px}
html[dir=rtl] .entry-direct::after{content:'↖'}
.hdr .quick .menu-btn{display:inline-flex;align-items:center}
.lead .top{gap:12px}
.lead .top .menu-btn{display:inline-flex;align-items:center;margin-top:16px}
.journey-controls{position:fixed;inset-inline-end:22px;bottom:max(20px,env(safe-area-inset-bottom));z-index:40;display:none;gap:8px}
html.journey .journey-controls{display:flex}
.journey-controls button{min-height:44px;border:1px solid var(--ink);border-radius:30px;background:#fff;color:var(--ink);padding:9px 18px;font-size:14px}
.dot6{animation:none}
.dot6 b{transition:transform .4s var(--ease-out)}
.dot6:hover b,.dot6:focus-visible b{transform:scale(1.04)}
.dot6 .dot-label{display:block;font:500 11px/1.35 var(--text);letter-spacing:.06em;margin-top:7px;max-width:18ch}
html[dir=rtl] .dot6 .dot-label{font-family:var(--ar-text);letter-spacing:0;font-size:12px}
.chapter .head{padding-top:clamp(45px,6vw,94px);padding-bottom:clamp(30px,4vw,64px)}
.chapter .head h1{max-width:16ch;font-size:clamp(48px,7.2vw,112px);line-height:1.03}
html[dir=rtl] .chapter .head h1{line-height:1.3}
.edition-label{display:flex;align-items:center;gap:12px;font:500 12px/1.4 var(--text);letter-spacing:.16em;text-transform:uppercase;margin:0 0 24px}
.edition-label::before{content:'';width:9px;height:9px;border-radius:50%;background:var(--eye);flex:none}
html[dir=rtl] .edition-label{font-family:var(--ar-text);letter-spacing:0;font-size:14px}
.chapter .head .intro{font-size:clamp(18px,1.55vw,23px);line-height:1.65;max-width:49ch}
.chapter-index{margin:0 auto;padding:0 var(--pad,5vw) 30px;max-width:1500px}
.chapter-index details{border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.chapter-index summary{display:flex;justify-content:space-between;align-items:center;list-style:none;min-height:54px;font-size:14px;font-weight:600;cursor:pointer}
.chapter-index summary::-webkit-details-marker{display:none}
.chapter-index summary::after{content:'+';font-size:24px;font-weight:400}
.chapter-index details[open] summary::after{content:'−'}
.chapter-index ol{list-style:none;margin:0;padding:0 0 20px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 30px;counter-reset:chapters}
.chapter-index li{counter-increment:chapters;min-width:0}
.chapter-index a{display:flex;gap:14px;align-items:baseline;min-height:48px;padding:12px 0;text-decoration:none;font-size:15px;line-height:1.5;border-top:1px solid var(--rule)}
.chapter-index a::before{content:counter(chapters,decimal-leading-zero);font-size:11px;letter-spacing:.05em;opacity:.65;flex:none}
.chapter-index a:hover,.chapter-index a[aria-current]{text-decoration:underline;text-underline-offset:5px}
.band,.split{scroll-margin-top:calc(var(--hb,76px) + 30px)}
.chapter .band>h2{max-width:22ch}
.chapter .band>h2::after{content:'';display:block;width:44px;height:2px;background:var(--eye);margin-top:24px}
.view-trigger{display:block;width:100%;border:0;padding:0;background:transparent;color:inherit;position:relative;text-align:inherit}
.view-trigger::after{content:'↗';position:absolute;inset-inline-end:10px;bottom:10px;display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--rule);border-radius:50%;background:#fff;color:var(--ink);font:400 20px/1 var(--text);opacity:0;transform:translateY(4px);transition:opacity .25s,transform .4s var(--ease-out);pointer-events:none}
.view-trigger:hover::after,.view-trigger:focus-visible::after{opacity:1;transform:none}
.view-trigger img{width:100%;height:auto}
.viewing-room{position:fixed;inset:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:var(--paper,#fff);color:var(--ink);overflow:hidden}
.viewing-room::backdrop{background:var(--paper,#fff)}
.viewing-room[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}
.room-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px;padding:12px clamp(18px,4vw,64px);border-bottom:1px solid var(--rule)}
.room-brand{font:500 23px/1.2 var(--display);margin:0}
.room-bar button,.room-bottom button{border:1px solid var(--ink);border-radius:999px;min-height:44px;min-width:44px;padding:8px 18px;background:transparent;color:inherit;font-size:14px}
.room-image{min-height:0;display:flex;align-items:center;justify-content:center;padding:clamp(16px,3vw,44px);overflow:hidden}
.room-image img{width:100%;height:100%;object-fit:contain;max-width:1500px}
.room-bottom{padding:16px clamp(18px,4vw,64px) max(18px,env(safe-area-inset-bottom));border-top:1px solid var(--rule);display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:26px}
.room-caption{min-width:0;text-align:center}
.room-caption p{margin:0;font-size:15px;line-height:1.5}
.room-count{font-size:11px;letter-spacing:.15em;margin-top:6px;display:block}
body.room-open{overflow:hidden}
.room-error{font-size:16px;max-width:32ch;text-align:center}
.mnav{background:var(--paper,#fff)!important}
.mnav .mtop{margin-bottom:clamp(16px,3vh,34px)}
.mnav li a{transition:padding .35s var(--ease-out)}
.mnav li a:hover{padding-inline-start:12px}
.mnav li a i{background:var(--c)}
.popen .abi{max-width:70ch}
.popen .abi p{line-height:1.9}
html.still .still-img.hidden{visibility:visible}
html.still .lead{opacity:1!important;transform:none!important;visibility:visible!important}
html.still .phonetop{opacity:1!important}
html.still .dot6{animation:none}
html:not(.js) .inside,html.still .inside{min-height:100svh}
html:not(.js) .panels .panel:target{grid-template-columns:minmax(0,1fr);padding-top:60px}
.panel-return{display:none}
html:not(.js) .panel-return{display:block;position:absolute;top:16px;inset-inline-end:24px;min-height:44px}
html:not(.js) .ah{display:none}
html:not(.js) .ab{display:block;max-height:none;grid-template-rows:1fr}
@media(min-width:901px) and (min-aspect-ratio:5/4){
 .lead h1{font-size:clamp(50px,4.7vw,76px)}
 .chapter .head{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(240px,.8fr);column-gap:7vw;align-items:end}
 .chapter .head .edition-label{grid-column:1/-1}
 .chapter .head .intro{margin:0 0 6px}
 .chapter .head>*:not(h1):not(.intro):not(.edition-label){grid-column:1/-1}
 .mnav{padding:24px clamp(30px,8vw,130px) 36px!important}
 .mnav ol{display:grid;grid-template-columns:1fr 1fr;column-gap:8vw}
 .mnav li a{min-height:84px!important;font-size:clamp(28px,3vw,44px)!important}
 .mnav .mfoot{margin-top:auto;padding-top:32px}
}
@media(max-width:900px),(max-aspect-ratio:5/4){
 .entrance{height:340svh}
 .entry-caption{display:none}
 .entry-direct{font-size:13px;margin-top:0;min-height:36px}
 .lead .cue{min-height:44px;margin-top:10px}
 .dwrap{--pd:min(126px,31vw,15.5svh)!important}
 .dot6{padding:9%}
 .dot6 b{font-size:clamp(14px,4vw,19px)}
 html[dir=rtl] .dot6 b{font-size:clamp(17px,4.7vw,23px)}
 .dot6 .dot-label{display:none}
 .chapter .head h1{font-size:clamp(44px,9vw,76px)}
 .chapter-index ol{grid-template-columns:1fr 1fr;gap:0 18px}
 .view-trigger::after{opacity:1;transform:none;width:30px;height:30px;font-size:17px}
 .room-bar{min-height:64px;padding-inline:18px}
 .room-brand{font-size:19px}
 .room-bottom{gap:10px;padding-inline:14px}
 .room-bottom button{padding:8px 13px}
 .room-caption p{font-size:13px;max-height:4.5em;overflow:auto}
 .edition-label{margin-bottom:20px}
}
@media(max-width:420px){.chapter-index ol{grid-template-columns:1fr}.room-bottom{grid-template-columns:44px minmax(0,1fr) 44px}}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

.room-image img[hidden]{display:none}

.room-loading{font-size:14px;line-height:1.6;text-align:center;color:var(--muted)}
.room-image [hidden]{display:none!important}
@media(max-height:500px) and (orientation:landscape){
 .room-bar{min-height:48px;padding-block:3px}
 .room-image{padding:8px 18px}
 .room-bottom{padding-block:5px;gap:12px}
 .room-caption p{font-size:12px;max-height:3em;overflow:auto}
 .room-count{margin-top:2px}
}
