@import"https://fonts.googleapis.com/css2?family=Source+Serif+4:wght@400;500;600;700&family=Inter:wght@400;500;600;700&family=Noto+Naskh+Arabic:wght@400;500;600;700&display=swap";:root{--bg: #111315;--surface: #181b1f;--surface-muted: #23272d;--border: #30363d;--text-main: #f2ede6;--text-soft: #c7beb2;--text-faint: #968b7f;--accent: #d2b48c;--accent-soft: #2a241e;--shadow: 0 18px 40px rgba(0, 0, 0, .34)}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{min-height:100%;max-width:100%;overflow-x:hidden}body{font-family:Inter,sans-serif;color:var(--text-main);min-height:100dvh;-webkit-tap-highlight-color:transparent;background:radial-gradient(circle at top,rgba(210,180,140,.08),transparent 32%),linear-gradient(180deg,#15181b 0%,var(--bg) 100%)}.page-shell{width:min(760px,100% - 24px);margin:14px auto;position:relative;max-width:100%}.page-card{background:var(--surface);border:1px solid var(--border);border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}.page-header{padding:16px 18px 12px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,rgba(255,255,255,.02),transparent)}.title{font-family:"Source Serif 4",serif;font-size:clamp(1.55rem,3vw,2rem);font-weight:600;letter-spacing:-.02em;line-height:1.1}.eyebrow{margin-bottom:4px;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint);font-weight:600}.page-body{padding:clamp(12px,2.5vw,18px);display:grid;gap:12px}.progress-wrap{width:100%;height:4px;border-radius:999px;background:var(--surface-muted);overflow:hidden}.progress-bar{height:100%;border-radius:inherit;background:var(--accent);transition:width .18s ease}.box{width:100%;background:#16191d;border:1px solid var(--border);border-radius:14px;padding:clamp(14px,3vw,20px);color:var(--text-main);transition:transform .14s ease,opacity .14s ease;overflow-x:hidden;overflow-y:auto;will-change:transform,opacity;min-height:min(68vh,720px);max-height:min(68vh,720px);box-shadow:inset 0 1px #ffffff05}.box.slide-out-left{transform:translate(-10px);opacity:0}.box.slide-out-right{transform:translate(10px);opacity:0}.box.slide-in-left{transform:translate(-10px);opacity:0}.box.slide-in-right{transform:translate(10px);opacity:0}.arabic{font-family:Noto Naskh Arabic,serif;font-weight:600;line-height:1.9;font-size:clamp(1.55rem,3.5vw,2.1rem);direction:rtl;text-align:right}@media(max-width:480px){.arabic{font-size:clamp(1.2rem,4vw,1.6rem)}.translation{font-size:clamp(.9rem,2.5vw,1rem)}}.translation{margin-top:16px;font-family:"Source Serif 4",serif;font-size:clamp(.98rem,1.8vw,1.08rem);line-height:1.72;color:var(--text-soft);white-space:normal;overflow-wrap:break-word;word-break:break-word}.controls{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.controls button{appearance:none;border:1px solid var(--border);background:#1c2025;color:var(--text-main);font-weight:500;font-size:.95rem;border-radius:10px;padding:10px 14px;cursor:pointer;transition:border-color .14s ease,background-color .14s ease,color .14s ease}.controls button:hover{border-color:var(--accent);background:var(--accent-soft);color:#fff7ed}.controls button:active{background:#332b23}.controls button:focus-visible{outline:3px solid rgba(210,180,140,.24);outline-offset:2px}.prev-btn{justify-self:start}.next-btn{justify-self:end}.count{font-size:.92rem;font-weight:500;color:var(--text-soft)}.desktop-hint{text-align:center;color:var(--text-faint);font-size:.86rem}.footer{text-align:center;color:var(--text-faint);font-size:.8rem;padding-top:0}.box::-webkit-scrollbar{width:10px}.box::-webkit-scrollbar-thumb{background:#625647;border-radius:999px;border:2px solid transparent;background-clip:padding-box}.box::-webkit-scrollbar-thumb:hover{background:#7a6c5b;background-clip:padding-box}@media(max-width:720px){.page-shell{width:min(760px,100% - 16px);margin:8px auto}.page-header{padding:14px 14px 10px}.box{min-height:70vh;max-height:70vh}.controls{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"prev next" "count count"}.prev-btn{grid-area:prev}.next-btn{grid-area:next}.count{grid-area:count;justify-self:center}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}