/* Daily Hafez fal: Tabestoon theme (sea blue, sand, cream), on /fal and in the menu sheet */
:root{--blue:#3D7FCC;--sky:#78B6E6;--sand:#E9D1B1;--cream:#FAF7EF;--navy:#2D3E50;--ink:var(--navy);--muted:#6b7a89;--bg:var(--cream);--card:#fff;--line:#ece3d3}
@media (prefers-color-scheme:dark){:root{--ink:#f3efe6;--muted:#a9b6c3;--bg:#1b2632;--card:#243242;--line:#33455a}}
.fal-page{margin:0;min-height:100vh;display:flex;flex-direction:column;font-family:Vazirmatn,Tahoma,sans-serif;background:var(--bg);color:var(--ink)}
.fal-page main{flex:1;width:100%;max-width:560px;margin:0 auto;padding:0 16px 24px;box-sizing:border-box}
.fal-head{text-align:center;padding:22px 16px 6px}
.fal-head img{width:min(180px,50vw);height:auto}
.fal-waves{display:block;width:100%;height:48px}
.fal{text-align:center;line-height:1.9}
.fal [hidden]{display:none!important}
.fal h2{margin:6px 0 4px;font-size:1.35rem}
.fal-sun{width:56px;height:56px;color:var(--blue);margin-top:16px;animation:spin 18s linear infinite}
@media (prefers-color-scheme:dark){.fal-sun{color:var(--sky)}}
@keyframes spin{to{transform:rotate(360deg)}}
.fal-intro p{color:var(--muted);margin:4px 0 18px}
.fal-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:52px;padding:0 22px;border:0;border-radius:16px;background:var(--blue);color:#fff;font:inherit;font-weight:700;text-decoration:none;cursor:pointer}
.fal-btn.ghost{background:var(--sand);color:var(--navy)}
.fal-btn:disabled{opacity:.6}
.fal-msg{color:#c0392b;font-weight:700}
/* The book: two covers swing open over a page */
.fal-opening{padding:30px 0}
.book{position:relative;display:block;width:150px;height:110px;margin:10px auto 18px;perspective:600px}
.book .page{position:absolute;inset:6px 8px;background:var(--cream);border:1px solid var(--line);border-radius:4px}
.book .cover{position:absolute;top:0;bottom:0;width:50%;background:var(--blue);border:3px solid var(--sand);box-sizing:border-box}
.book .left{left:0;border-radius:8px 0 0 8px;transform-origin:right;animation:openL 1.6s ease-in-out forwards}
.book .right{right:0;border-radius:0 8px 8px 0;transform-origin:left;animation:openR 1.6s ease-in-out forwards}
@keyframes openL{to{transform:rotateY(-160deg)}}
@keyframes openR{to{transform:rotateY(160deg)}}
.fal-date{margin:0 0 10px;color:var(--muted);font-size:.85rem}
.poem{margin:0 auto 14px}
.beit{margin:0 0 12px;display:flex;flex-direction:column}
.beit span{display:block;font-size:1.02rem}
.beit span+span{color:var(--blue)}
@media (prefers-color-scheme:dark){.beit span+span{color:var(--sky)}}
.in{opacity:0;animation:fadeIn .7s ease-out forwards}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.fal-card{background:var(--sand);color:var(--navy);border-radius:20px;padding:14px 18px;text-align:right;margin:0 0 16px}
.fal-card h3{margin:0 0 4px;font-size:1rem}
.fal-card p{margin:0}
.fal-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.fal-actions .fal-btn{flex:1 1 140px}
.fal-tomorrow{color:var(--muted);font-size:.9rem;margin:14px 0 0}
.fal-credit{font-size:.7rem;color:var(--muted);margin:18px 0 0}
.fal-credit a{color:inherit}
@media (prefers-reduced-motion:reduce){.fal-sun,.book .cover,.in{animation:none;opacity:1}}
/* In the menu: the strip under the hero and the sheet */
.fal-strip{display:flex;align-items:center;gap:12px;width:calc(100% - 32px);max-width:928px;margin:12px auto 0;padding:12px 14px;border:1px solid var(--sky);border-radius:18px;background:linear-gradient(90deg,#e6f1fb,#fbf1e2);color:var(--navy);font:inherit;text-align:right;cursor:pointer}
@media (prefers-color-scheme:dark){.fal-strip{background:linear-gradient(90deg,#223a52,#3a3428);color:var(--ink)}}
.fal-strip-icon{font-size:1.6rem}
.fal-strip [data-fal-strip]{flex:1;min-width:0;display:flex;flex-direction:column}
.fal-strip small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fal-strip-go{font-size:1.6rem;color:var(--blue)}
.fal-sheet .fal{padding:8px 18px 28px}
.fal-sheet{overflow-y:auto}