@font-face{font-family:"Amiri";src:url("../assets/fonts/Amiri-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
:root{--poem:"Amiri","Noto Naskh Arabic","Traditional Arabic",serif}
html[dir="rtl"] *{letter-spacing:normal}

/* Entry and first-use guidance */
.entry-control{gap:1rem}
.entry-control>i{width:3.25rem;border-color:#e4ded0a8;box-shadow:0 0 0 0 #e5ded017}
.entry-control>i::before{width:4px;height:4px}
.entry-control>i::after{width:1.35rem;right:-.82rem;background:linear-gradient(90deg,#ddd8cb,transparent)}
.entry-control>i{animation:entry-breathe 3.8s ease-in-out infinite}
.entry-control:hover>i,.entry-control:focus-visible>i{transform:rotate(90deg) scale(1.04);background:#ddd8cb10;animation-play-state:paused}
.entry-control b{font-size:.95rem}
.entry-control small{margin-top:.28rem;color:#aeb9bc;font-size:.66rem}
.entry-control small::after{width:5.6rem;margin-top:.62rem;background:linear-gradient(90deg,#d8d5ca73,transparent)}
@keyframes entry-breathe{0%,100%{box-shadow:0 0 0 0 #e5ded000}50%{box-shadow:0 0 0 8px #e5ded010}}
.scroll-guidance,.reader-guidance{position:fixed;z-index:76;left:50%;bottom:calc(2rem + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:.7rem;direction:rtl;color:#c5cdca;font-size:.67rem;opacity:0;visibility:hidden;transform:translate(-50%,10px);transition:opacity .55s ease,transform .55s ease,visibility .55s;pointer-events:none}
.scroll-guidance.is-visible,.reader-guidance.is-visible{opacity:.78;visibility:visible;transform:translate(-50%,0)}
.scroll-guidance>i,.reader-guidance>i{position:relative;display:block;width:1px;height:2.7rem;overflow:hidden;background:#d9d5cc38}
.scroll-guidance>i>b,.reader-guidance>i>b{position:absolute;top:-30%;left:0;width:1px;height:42%;background:#e4dfd4;animation:guidance-drop 1.9s ease-in-out infinite}
@keyframes guidance-drop{0%{transform:translateY(0);opacity:0}25%{opacity:.9}80%,100%{transform:translateY(8rem);opacity:0}}

/* Refined Arabic scale and hierarchy */
.hurt-main{top:18%;width:36%}
.hurt-main .support{margin-bottom:2.6rem;font-size:clamp(1.05rem,1.3vw,1.3rem);line-height:2.05}
.hurt-main h2{font-size:clamp(4.7rem,6.7vw,6rem);line-height:1.02}
.hurt-aside{bottom:9vh;max-width:28rem;font-size:clamp(1.02rem,1.25vw,1.22rem);line-height:2.35}
.memory-emergence h2{font-size:clamp(3.4rem,4.8vw,5.3rem);line-height:1.12}
.choice__still p{margin-bottom:2rem;font-size:clamp(1rem,1.2vw,1.15rem)}
.choice__still h2{font-size:clamp(4.5rem,7.4vw,6rem);line-height:1.02}
.sunrise__copy p{margin-bottom:1.2rem;font-size:clamp(1rem,1.25vw,1.18rem)}
.sunrise__copy h2{font-size:clamp(4rem,5.7vw,5.7rem);line-height:1.12}

/* Letter as a physical invitation */
.letter-arrival__sticky>img{transition:filter .8s var(--ease),transform 1.1s var(--ease)}
.letter-arrival__sticky:has(.open-letter:hover)>img,.letter-arrival__sticky:has(.open-letter:focus-visible)>img{filter:saturate(.82) brightness(.84);transform:scale(1.025)}
.open-letter{gap:1.15rem;padding:.75rem .2rem}
.open-letter span{font-size:.9rem;color:#e8e3db}
.open-letter i{width:3rem;border-color:#ded8ce9b;box-shadow:0 0 0 0 #efe8dc12;animation:letter-breathe 4.2s ease-in-out infinite}
.open-letter:hover i,.open-letter:focus-visible i{transform:rotate(90deg) scale(1.05);animation-play-state:paused}
@keyframes letter-breathe{0%,100%{box-shadow:0 0 0 0 #efe8dc00}50%{box-shadow:0 0 0 10px #efe8dc10}}

/* Isolated, native poem reading state */
.poem-reader{height:100dvh;max-height:100dvh;overscroll-behavior:none}
.reader-scroll{position:absolute;inset:0;height:100dvh;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable;padding:4.5vh 0 7vh}
.poem-page{width:min(68vw,1080px);min-height:91vh;padding:4.8rem clamp(4.5rem,7.2vw,8rem) 4.5rem;background:linear-gradient(101deg,#d4c1a8 0%,#eee2cf 47%,#e3d1b9 100%);box-shadow:0 38px 130px #000a,0 1px 0 #fff8 inset}
.poem-page::before{opacity:.1}
.poem-page::after{opacity:.5}
.poem-page header p{font-size:.68rem;color:#7c6a5e}
.poem-page header h2{margin:.45rem 0 2.6rem;font:400 1.35rem/1.6 var(--naskh)}
.poem-text{font:400 clamp(1.55rem,2.05vw,2rem)/1.75 var(--poem);text-wrap:pretty}
.poem-text p{margin:0 0 1.15rem}
.poem-text p:last-child{margin-top:2rem;font-weight:400}
.poem-page footer{margin-top:3rem}
.poem-page footer p{font:400 1rem/1.8 var(--poem)}
.reader-close{position:fixed;z-index:12;top:calc(2rem + env(safe-area-inset-top));left:2.2rem;width:auto;aspect-ratio:auto;display:flex;direction:rtl;align-items:center;gap:.85rem;padding:.45rem;border:0;border-radius:0;background:transparent;color:#d5dcda}
.reader-close__label{font-size:.72rem;font-weight:300;white-space:nowrap}
.reader-close>i{position:relative;display:block;width:2.55rem;aspect-ratio:1;border:1px solid #b9c1c27d;border-radius:50%;transition:transform .5s var(--ease),background .4s}
.reader-close>i::before,.reader-close>i::after{content:"";position:absolute;left:50%;top:50%;width:.8rem;height:1px;background:#cbd2d0;transform-origin:center}
.reader-close>i::before{transform:translate(-50%,-50%) rotate(45deg)}
.reader-close>i::after{transform:translate(-50%,-50%) rotate(-45deg)}
.reader-close:hover>i,.reader-close:focus-visible>i{transform:rotate(90deg);background:#fff1}
.reader-guidance{z-index:13;bottom:calc(1rem + env(safe-area-inset-bottom));color:#d7d8d1}

@media(max-width:700px){
  .entry-control{left:1.25rem;bottom:calc(1.6rem + env(safe-area-inset-bottom));gap:.85rem}
  .entry-control>i{width:2.85rem}
  .scroll-guidance{bottom:calc(1.2rem + env(safe-area-inset-bottom));font-size:.64rem}
  .hurt-main{top:19%;right:1.45rem;width:calc(100% - 2.9rem)}
  .hurt-main .support{font-size:.98rem;line-height:2.05;margin-bottom:2.8rem}
  .hurt-main h2{font-size:clamp(3.8rem,17vw,4.9rem);line-height:1.02}
  .hurt-aside{bottom:7vh;font-size:.98rem;line-height:2.15}
  .memory-emergence h2{font-size:clamp(3rem,12.5vw,4rem);line-height:1.15}
  .choice__still h2{font-size:clamp(3.8rem,17vw,4.9rem);line-height:1.04}
  .sunrise__copy p{font-size:.94rem;margin-bottom:.65rem}
  .sunrise__copy h2{font-size:clamp(3.2rem,13.5vw,4.3rem);line-height:1.14}
  .letter-arrival__copy p{font-size:.86rem;line-height:2}
  .open-letter{bottom:calc(1.6rem + env(safe-area-inset-bottom))}
  .open-letter span{font-size:.84rem}
  .poem-reader{height:100dvh;max-height:100dvh;background:var(--paper)}
  .reader-scroll{height:100dvh;padding:0;scrollbar-gutter:auto}
  .poem-page{width:100%;min-height:100dvh;margin:0;padding:calc(5.7rem + env(safe-area-inset-top)) 1.55rem calc(5.4rem + env(safe-area-inset-bottom));background:linear-gradient(104deg,#dbc9b0,#eee2cf 52%,#e2d0b7);box-shadow:none}
  .poem-page header{padding-left:4.8rem}
  .poem-page header p{font-size:.65rem;line-height:1.8}
  .poem-page header h2{font-size:1.15rem;margin:.35rem 0 2.7rem}
  .poem-text{font:400 clamp(1.35rem,5.9vw,1.58rem)/1.9 var(--poem);text-align:right}
  .poem-text p{margin-bottom:1.5rem}
  .poem-text p:last-child{margin-top:2.4rem}
  .poem-page footer{margin-top:3.2rem}
  .reader-close{top:calc(.85rem + env(safe-area-inset-top));left:.8rem;gap:.55rem;padding:.35rem .45rem .35rem .35rem;color:#5f5249;background:#e7d8c6d9;border:1px solid #786a5a26;backdrop-filter:blur(8px)}
  .reader-close__label{font-size:.66rem}
  .reader-close>i{width:2.25rem;border-color:#77695a70}
  .reader-close>i::before,.reader-close>i::after{background:#65584f}
  .reader-guidance{bottom:calc(.8rem + env(safe-area-inset-bottom));color:#65584f}
  .reader-guidance>i{background:#6f615237}.reader-guidance>i>b{background:#65584f}
}

@media(prefers-reduced-motion:reduce){.entry-control>i,.open-letter i,.scroll-guidance>i>b,.reader-guidance>i>b{animation:none!important}}