/* הדבורה מאיה — שכבת "הספר" · אב-טיפוס 27.09.2026 · נטען אחרי style.css
   שני מצבים: (1) מחשב עם עכבר (hover:hover, ≥900px) — דפים מוערמים ומתהפכים כמו ספר, ציר הספר בצד
   ההתחלה (ימין בעברית, שמאל ברוסית); (2) טלפון/מגע — זרימה אנכית עם scroll-snap וצל קיפול, בלי תלת-ממד.
   prefers-reduced-motion: בלי היפוך, בלי דבורה מעופפת. הרקעים: איורי AI (social/ai-images, 27.09), מרכז ריק לטקסט. */
:root{--page-dur:.72s;--bee:72px}
.book{position:relative}
.page{position:relative;min-height:100vh;min-height:100dvh;background-color:var(--s0);background-position:center;background-size:cover;background-repeat:no-repeat;padding-block:8px 72px;box-sizing:border-box}
.page[data-bg="paper"]{background-image:url(media/bg-honeycomb-paper.jpg)}
.page[data-bg="nursery"]{background-image:url(media/bg-hive-nursery.jpg)}
.page[data-bg="garden"]{background-image:url(media/bg-helper-bees-garden-3d.jpg)}
.page[data-bg="caregiver"]{background-image:url(media/bg-caregiver-bee.jpg)}
/* 28.09: הוחלפו לגרסת התלת-ממד (gpt-image-2, prompts/mj3d/), הקבצים *-3d.jpg; הגרסה המצוירת נשארת בתיקייה */
/* איורים ייעודיים לדף (27.09, edit.mjs עם הלוגו כרפרנס): הנסיכה בכניסה לכוורת · תינוקייה · המלכה עם שעון · הדרך לכוורת */
.page[data-bg="hero"]{background-image:url(media/bg-hero-princess-3d.jpg)}
.page[data-bg="babies"]{background-image:url(media/bg-nursery-babies-3d.jpg)}
.page[data-bg="hours"]{background-image:url(media/bg-hours-queen-3d.jpg)}
.page[data-bg="register"]{background-image:url(media/bg-register-path-3d.jpg)}
.page[data-bg="queen"]{background-image:url(media/bg-caregiver-nocrown-3d.jpg)} /* 28.09 — המלכה מקבלת את התינוקים, אותו כתר כמו בדף 4 */
.page[data-bg="day"]{background-image:url(media/bg-day-table-3d.jpg)} /* 28.09 ערב — דף 2: שולחן אוכל (שמאל) + פינת קריאה (ימין), מרכז ריק */
/* 28.09 — שורת "סיפור" בראש כל דף (build-book.py) ותג "יש מקום" כתא חלת דבש */
.story{max-width:var(--max);margin:0 auto 2px;padding:6px 16px 0;font-weight:500;color:var(--honey-deep);font-size:1rem}
.page .tag-open{background:linear-gradient(160deg,#F6CC66,#E2B24C);border-radius:0;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,12px 100%,0 50%);padding:6px 24px;text-shadow:none}
.page .year th,.page .year td{border-bottom-color:rgba(78,45,22,.25)}
.page .day-line li{border-bottom-color:rgba(78,45,22,.25)}
.page .day-note{color:var(--honey-deep)}
/* הסקשנים שקופים — הרקע של הדף עובר; הכרטיסים הלבנים נשארים כמו באתר */
.page .alt,.page .hero,.page .band{background:transparent}
.page .hero{padding-block:24px}
.page section,.page .band{padding-block:28px}
/* ‏"גיליון" — פס קרם שקוף-למחצה מאחורי הטקסט, כדי שהאיור לא יתחרה בקריאות */
.sheet{max-width:calc(var(--max) + 32px);margin-inline:auto;background:transparent;border-radius:var(--radius);padding:8px 0}
/* 28.09 (יגאל): בלי "דף לבן חצי שקוף" — הכיתוב יושב על האיור עצמו. הקריאות: הילה קרם עדינה סביב האותיות (text-shadow יורש),
   כותרת-משנה ופוטר בחום הדבש במקום אפור; אלמנטים עם רקע משלהם (כרטיסים, שורות, כפתורים, צ'יפים) בלי הילה */
.sheet{text-shadow:0 0 10px var(--cream),0 0 3px var(--cream),0 1px 0 var(--cream)}
.page .card,.page .features li,.page details,.page .btn,.page .trust li,.page .todo,.page .sticky,.page figure{text-shadow:none}
.page .hero h1,.page footer{color:var(--honey-deep)}
/* 28.09 (יגאל): כל התמונות בתוך משושה של חלת דבש, בלי מסגרות לבנות — כרטיסים, שורות ה"מקום" ושאלות נטמעים באיור */
.page .ph{clip-path:polygon(50% 0,97% 24%,97% 76%,50% 100%,3% 76%,3% 24%);border-radius:0;box-shadow:none;aspect-ratio:1/1.08;padding:5px;background:linear-gradient(160deg,#F6CC66,#D9A441)} /* 28.09 (יגאל): מסגרת חלת דבש — שוליים בצבע דבש סביב כל תא */
.page .ph img{clip-path:polygon(50% 0,97% 24%,97% 76%,50% 100%,3% 76%,3% 24%)}
.page .hero-art .ph{aspect-ratio:1/1.08}
/* חלת דבש של 3 בפתיח: שתיים למעלה, אחת מתחת באמצע */
.page .hero-art .comb{max-width:none}
.page .hero-art .comb .ph{height:auto!important;max-width:none}
.page .hero-art .comb .ph:nth-child(3){grid-column:2/span 2;margin-top:-24%}
/* 28.09 (יגאל): כל הכפתורים הירוקים → "תא חלת דבש": מעבר צבע דבש, טקסט חום, קצוות מחודדים כמו משושה; הגודל לפי הדף */
.page .btn-wa{background:linear-gradient(160deg,#F6CC66,#E2B24C);border:0;color:var(--honey-deep);clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,14px 100%,0 50%);padding:12px 30px;box-shadow:none;text-shadow:none}
.page .btn-wa svg{color:var(--honey-deep)}
.page .btn-wa:hover{background:linear-gradient(160deg,#FAD174,#E9B84E)}
.page .hero .btn-wa{min-height:56px;font-size:1.1rem}
.page .card .btn-wa{min-height:44px;font-size:.95rem;padding:8px 26px}
.page #register .btn-wa{min-height:50px}
/* הכפתור הצף (28.09, יגאל — אופציה א׳): משושה דבש עם אייקון חום, פינה ימנית-תחתונה פיזית, לא ירוק */
.sticky{inset-inline-end:auto;right:16px;left:auto}
.sticky a{border-radius:0;clip-path:polygon(50% 0,97% 24%,97% 76%,50% 100%,3% 76%,3% 24%);background:linear-gradient(160deg,#FAD174,#E9B84E);color:var(--honey-deep);box-shadow:none;width:56px;height:62px}
.sticky{filter:drop-shadow(0 6px 8px rgba(78,45,22,.35))}
.page .card{background:transparent;border:0;box-shadow:none;padding:0 8px}
.page .card .ph{max-width:340px;margin-inline:auto}
.page .features li{background:transparent;border:0;border-inline-start:3px solid var(--honey);border-radius:0;box-shadow:none;padding:6px 12px}
.page details{background:transparent;border:0;border-bottom:1px dashed rgba(78,45,22,.35);border-radius:0;box-shadow:none;padding:0 4px;margin-bottom:4px}
.page details p{text-shadow:0 0 10px var(--cream),0 0 3px var(--cream),0 1px 0 var(--cream)}
.page .entrance{max-width:340px}
/* חלת דבש של 4 תאים (28.09, יגאל): 2+2, השורה השנייה מוזזת בחצי תא ומשתלבת בראשונה — גם הגלריה (דף 3) וגם ה-comb של הקבוצות (דף 2) */
.page .gallery,.page .comb{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0 6px;row-gap:0;max-width:560px;margin-inline:auto}
.page .gallery .ph,.page .comb .ph{grid-column:span 2;margin-top:0}
.page .gallery .ph:nth-child(1),.page .comb .ph:nth-child(1){grid-column:1/span 2}
.page .gallery .ph:nth-child(2),.page .comb .ph:nth-child(2){grid-column:3/span 2}
.page .gallery .ph:nth-child(3),.page .comb .ph:nth-child(3){grid-column:2/span 2;margin-top:-24%}
.page .gallery .ph:nth-child(4),.page .comb .ph:nth-child(4){grid-column:4/span 2;margin-top:-24%}
.page .comb{margin-bottom:12px}
.page .ph-todo{display:grid;place-items:center;background:rgba(254,242,215,.7);border:0}
.page .ph-todo .todo{font-size:.7rem;max-width:80%;text-align:center}
.page .card{padding:0 8px;text-align:center}
.page .card .btn{width:auto}
.page footer{border-top-color:rgba(78,45,22,.25)}
/* צל הכריכה בצד ההתחלה — הדף "יוצא מהספר" */
.page::before{content:"";position:absolute;inset-block:0;inset-inline-start:0;width:30px;pointer-events:none;background:linear-gradient(to var(--fold-to,left),rgba(78,45,22,.16),rgba(78,45,22,0))}
html[dir="ltr"] .page::before{--fold-to:right}
.page+.page{border-top:1px solid rgba(78,45,22,.18)}
/* ניווט הספר */
.book-nav{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:60;display:flex;align-items:center;gap:8px;padding:6px 8px;background:rgba(255,255,255,.92);border:1px solid var(--edge);border-radius:var(--radius-pill);box-shadow:var(--e2);font-size:.95rem;font-weight:500;color:var(--honey-deep)}
.book-nav button{width:44px;height:44px;border-radius:50%;border:0;background:var(--honey-soft);color:var(--honey-deep);display:grid;place-items:center;cursor:pointer}
.book-nav button:disabled{opacity:.35;cursor:default}
.book-nav button:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
html[dir="rtl"] .book-nav svg{transform:scaleX(-1)}
.book-counter{min-width:9ch;max-width:min(60vw,360px);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* הכפתור הצף עולה מעל הניווט */
.sticky{bottom:calc(84px + env(safe-area-inset-bottom))}
/* ‏--- הדבורה-אווטאר (מחשב בלבד) · 28.09: הדמות השטוחה flat-3 מהווריאציות של יגאל (media/bee.svg), במקום הדמות המצוירת --- */
#bee{position:fixed;left:0;top:0;width:var(--bee);height:var(--bee);z-index:70;pointer-events:none;opacity:0;transform:translate(-200px,-200px);transition:transform .85s cubic-bezier(.3,.75,.25,1),opacity .3s ease;will-change:transform}
#bee.is-on{opacity:1}
#bee img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 6px 8px rgba(28,25,23,.25));transform-origin:50% 60%}
#bee.is-flying img{animation:bee-flap .22s ease-in-out infinite}
#bee.is-idle img{animation:bee-bob 2.6s ease-in-out infinite}
#bee.is-waiting img{animation:bee-bob 1.4s ease-in-out infinite}
#bee.is-pointing img{animation:bee-nod .9s ease-in-out 2}
#bee.face-left img{transform:scaleX(-1)}
#bee.face-left.is-idle img,#bee.face-left.is-waiting img{animation-name:bee-bob-flip}
/* החץ הקטן — מצביע אל האלמנט, בצד שפונה אליו */
.bee-arrow{position:absolute;width:0;height:0;border:9px solid transparent;opacity:0;transition:opacity .2s}
#bee.is-pointing .bee-arrow,#bee.is-waiting .bee-arrow{opacity:1}
#bee.arrow-left .bee-arrow{left:-16px;top:50%;margin-top:-9px;border-right-color:var(--honey-deep)}
#bee.arrow-right .bee-arrow{right:-16px;top:50%;margin-top:-9px;border-left-color:var(--honey-deep)}
#bee.arrow-down .bee-arrow{bottom:-16px;left:50%;margin-left:-9px;border-top-color:var(--honey-deep)}
#bee.arrow-up .bee-arrow{top:-16px;left:50%;margin-left:-9px;border-bottom-color:var(--honey-deep)}
/* נתיב הטיסה המנוקד */
#bee-path{position:fixed;inset:0;width:100%;height:100%;z-index:69;pointer-events:none;opacity:0;transition:opacity .4s}
#bee-path.is-on{opacity:.55}
#bee-path path{fill:none;stroke:var(--honey-deep);stroke-width:2;stroke-dasharray:3 9;stroke-linecap:round}
@keyframes bee-flap{0%,100%{transform:rotate(-4deg) translateY(0)}50%{transform:rotate(4deg) translateY(-2px)}}
@keyframes bee-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes bee-bob-flip{0%,100%{transform:scaleX(-1) translateY(0)}50%{transform:scaleX(-1) translateY(-6px)}}
@keyframes bee-nod{0%,100%{transform:rotate(0)}50%{transform:rotate(-10deg)}}
/* ‏--- מצב ספר: מחשב עם עכבר --- */
@media (hover:hover) and (pointer:fine) and (min-width:900px){
  body.book-mode{overflow:hidden}
  body.book-mode .book{height:100vh;height:100dvh;perspective:2600px;overflow:hidden}
  body.book-mode .page{position:absolute;inset:0;height:100vh;height:100dvh;overflow-y:auto;overscroll-behavior:contain;backface-visibility:hidden;-webkit-backface-visibility:hidden;transition:transform var(--page-dur) cubic-bezier(.45,0,.2,1);box-shadow:-24px 0 40px -28px rgba(78,45,22,.45)}
  html[dir="rtl"] body.book-mode .page{transform-origin:right center}
  html[dir="ltr"] body.book-mode .page{transform-origin:left center;box-shadow:24px 0 40px -28px rgba(78,45,22,.45)}
  html[dir="rtl"] body.book-mode .page.is-past{transform:rotateY(180deg)}
  html[dir="ltr"] body.book-mode .page.is-past{transform:rotateY(-180deg)}
  body.book-mode .page.is-past{pointer-events:none}
  body.book-mode .page.is-turning{z-index:100!important}
  body.book-mode .page+.page{border-top:0}
  /* דפי טקסט: גיליון צר יותר כדי שהדמויות בשולי האיור ייראו (הפתיח נשאר דו-טורי — הסף של style.css הוא לפי חלון) */
  body.book-mode .page[data-bg="hero"] .sheet,body.book-mode .page[data-bg="hours"] .sheet,body.book-mode .page[data-bg="register"] .sheet,body.book-mode .page[data-bg="caregiver"] .sheet{max-width:min(calc(var(--max) + 32px),68vw)}
  /* 28.09: הדמויות באיורים 4/5/6 יושבות בצד הימני הפיזי (האיור לא מתהפך ברוסית) — הטקסט זז שמאלה, במרווחים פיזיים, בשתי השפות */
  body.book-mode .page[data-bg="hours"] .sheet,body.book-mode .page[data-bg="register"] .sheet,body.book-mode .page[data-bg="queen"] .sheet{max-width:none;margin-left:6vw;margin-right:27vw}
  body.book-mode .page[data-bg="hours"] .sheet{margin-right:34vw} /* בגרסת התלת-ממד המלכה עם השעון גדולה ומרכזית יותר */
  /* 28.09 (יגאל): קיפול פינה במקום סיבוב סביב השדרה. book.js מזיז את --s (אורך רגל משולש הפינה) ב-rAF;
     הדף שמתקפל נחתך באלכסון 45° מהפינה החופשית (בעברית: שמאל-למטה; ברוסית: ימין-למטה), ו-#curl הוא גב הדף —
     משולש קרם עם צל שגדל לאורך קו הקיפול. בלי transition על transform: is-past הוא מצב "מוסתר" מיידי. */
  body.book-mode .page{transition:none}
  body.book-mode .page.is-turning{box-shadow:none}
  body.book-mode .page.is-curling{clip-path:polygon(0 0,100% 0,100% 100%,var(--s,0px) 100%,0 calc(100% - var(--s,0px)))}
  html[dir="ltr"] body.book-mode .page.is-curling{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--s,0px)),calc(100% - var(--s,0px)) 100%,0 100%)}
  body.book-mode .page.is-curling::after{display:none}
  #curl{position:absolute;bottom:0;left:0;width:0;height:0;z-index:101;display:none;pointer-events:none;clip-path:polygon(0 0,100% 0,100% 100%);background:linear-gradient(45deg,rgba(255,253,247,.35) 0%,#FFF8E6 38%,#EADFC4 78%,#D9CBAA 100%);filter:drop-shadow(-10px 10px 12px rgba(78,45,22,.38))}
  html[dir="ltr"] #curl{left:auto;right:0;clip-path:polygon(0 0,100% 0,0 100%);background:linear-gradient(315deg,rgba(255,253,247,.35) 0%,#FFF8E6 38%,#EADFC4 78%,#D9CBAA 100%);filter:drop-shadow(10px 10px 12px rgba(78,45,22,.38))}
  /* 28.09 (יגאל): לא להסתיר את הדמויות — הטקסט והתמונות במרכז הריק של כל איור (מרווחים פיזיים, האיור לא מתהפך ברוסית) */
  /* 28.09 (יגאל): פתיח — התמונה מימין, המלל משמאל, שניהם קטנים יותר, כדי שעץ הזית (שמאל) והדבורה (ימין) ייראו */
  body.book-mode .page[data-bg="hero"] .sheet{max-width:none;margin-left:12vw;margin-right:27vw}
  body.book-mode .page[data-bg="hero"] .hero .wrap{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:24px}
  body.book-mode .page[data-bg="hero"] .hero-art{order:-1}
  body.book-mode .page[data-bg="hero"] .hero-art .ph{height:auto;max-width:none;aspect-ratio:1/1.08}
  body.book-mode .page[data-bg="hero"] .hero h1 .big{font-size:2.5rem}
  body.book-mode .page[data-bg="hero"] .hero h1{font-size:1.25rem}
  body.book-mode .page[data-bg="hero"] .hero .lead{font-size:1rem;margin-bottom:12px}
  body.book-mode .page[data-bg="hero"] .hero-bee{width:72px;height:72px}
  body.book-mode .page[data-bg="babies"] .sheet{max-width:none;margin-left:16vw;margin-right:16vw}
  body.book-mode .page[data-bg="garden"] .sheet{max-width:none;margin-left:19vw;margin-right:19vw}
  /* 28.09 ערב — דף 2: הדמויות ליד השולחן בשמאל (עד ~30%) ופינת הקריאה בימין (מ-~63%); המרכז העליון ריק לרוחב כמעט מלא */
  body.book-mode .page[data-bg="day"] .sheet{max-width:none;margin-left:30vw;margin-right:36vw}
  body.book-mode .page[data-bg="day"] .sheet{padding-top:0}
  body.book-mode .page[data-bg="day"] section{padding-block:12px}
  /* 28.09 ערב — עם סדר היום הדף גבוה: "למה אצלנו" בטור אחד (בשני טורים צרים הרוסית נשברה ל-5 שורות לפריט) */
  body.book-mode .page[data-bg="day"] .features{grid-template-columns:minmax(0,1fr);gap:4px}
  body.book-mode .page[data-bg="day"] .features li{padding:3px 12px}
  body.book-mode .page[data-bg="day"] h2{margin-bottom:.35em}
  /* 28.09 ערב: #location עבר לדף 6 — תמונת הכניסה נשארת מוסתרת במחשב (החלטת יגאל 28.09); דף 6 — המלל למעלה */
  body.book-mode .page[data-bg="queen"] .entrance{display:none}
  body.book-mode .page[data-bg="queen"] .sheet{padding-top:0}
  body.book-mode .page[data-bg="queen"] section{padding-block:12px}
  body.book-mode .page[data-bg="queen"] .about-row{align-items:flex-start}
  /* בקצה הדף — "פינה" שמזמינה לדפדף */
  body.book-mode .page::after{content:"";position:absolute;bottom:0;inset-inline-end:0;width:56px;height:56px;background:linear-gradient(to top var(--corner-x,left),rgba(78,45,22,.22),rgba(255,255,255,0) 55%);pointer-events:none}
  html[dir="ltr"] body.book-mode .page::after{--corner-x:right}
}
/* ‏--- טלפון / מגע: זרימה אנכית עם הצמדה קלה, דבורה סטטית בפינת כל דף --- */
/* 28.09: הסף גם לפי רוחב (<900px) ולא רק hover:none — Playwright בהדמיית טלפון לא מדווח hover:none, וכך גם חלק מהמכשירים עם עכבר מחובר */
@media (hover:none),(max-width:899px){
  html{scroll-snap-type:y proximity}
  .page{scroll-snap-align:start}
  #bee,#bee-path,.book-nav{display:none}
  /* 28.09: בטלפון האיור הוא פס בראש כל דף (3:2 ברוחב המסך — הדמויות נראות בשלמותן, לא נחתכות ב-cover) והטקסט מתחתיו על קרם-דבש */
  .page{background-size:100% auto;background-position:top center;background-color:var(--honey-soft);padding-top:calc(100vw * 2 / 3)}
  .page::before{display:none}
  .page .sheet{position:relative}
  /* הדבורה הסטטית: בפינה השמאלית-עליונה הפיזית של הפס — שם באיורים יש רק משושים/עלים, בלי דמויות (בשתי השפות) */
  .page::after{content:"";position:absolute;top:10px;left:10px;width:44px;height:44px;background:url(media/bee-3d.png) center/contain no-repeat;opacity:.95;pointer-events:none}
  .page[data-page="1"]::after{display:none} /* בפתיח כבר יש דבורה ליד המשושה */
  /* בטלפון: שני משושים בשורה (שלושה יוצאים קטנים מדי), שורה שנייה מורמת מעט */
  .page .gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 6px}
  .page .gallery .ph:nth-child(n),.page .comb .ph:nth-child(n){grid-column:auto;margin-top:0} /* :nth-child(n) שווה-משקל לכללי המחשב ומאוחר יותר — מבטל את ההזזות */
  .page .comb{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 6px}
  .page .gallery .ph:nth-child(n+3),.page .comb .ph:nth-child(n+3){margin-top:-14%}
  .page .hero-art .comb .ph:nth-child(3){grid-column:1/span 2;max-width:50%;margin-inline:auto;margin-top:-14%}
  .sticky{bottom:calc(24px + env(safe-area-inset-bottom))}
  /* 28.09 — בטלפון דף 1 בלי שורת הסיפור: הפס + התג + "ברוכים הבאים" כבר פותחים, וה-CTA הרוסי חייב להישאר מעל 812 */
  .page[data-page="1"] .story{display:none}
}
/* ‏--- הפחתת תנועה: בלי היפוך, בלי דבורה מעופפת, ניווט מיידי --- */
@media (prefers-reduced-motion:reduce){
  #bee,#bee-path{display:none!important}
  body.book-mode .page{transition:none}
  #bee img{animation:none!important}
}
/* ‏=== 30.09 (יגאל): "שייראה כמו ספר" — כריכה, קצוות דפים, שולחן מסביב, ודפדוף שבו רואים את הדף מתהפך ===
   הספר יושב על "שולחן" עם כריכה קשה סביב הדפים; בצד החופשי (שמאל בעברית, ימין ברוסית) ובתחתית — ערימת דפים;
   בצד השדרה — צל עמוק של הכריכה. הדפדוף: הדף מסתובב סביב השדרה (rotateY) ומתכהה, ומעבר ל-90° "גב הדף" (#leaf)
   ממשיך את התנועה; על הדף שמתגלה נופל צל שזז עם קצה הדף (#curl). בפתיחה — כריכה (#cover) שנפתחת לבד. */
#leaf-stage{display:none}
@media (hover:hover) and (pointer:fine) and (min-width:900px){
  :root{--bk-t:74px;--bk-b:16px;--bk-x:max(28px,3.2vw);--bk-sign:1}
  html[dir="ltr"]{--bk-sign:-1}
  body.book-mode{background:
      radial-gradient(ellipse 70% 60% at 50% 45%,rgba(255,214,140,.22),rgba(0,0,0,0) 70%),
      repeating-linear-gradient(90deg,rgba(0,0,0,.035) 0 2px,rgba(0,0,0,0) 2px 7px),
      linear-gradient(180deg,#7A4B22 0%,#5E3817 55%,#442710 100%)}
  body.book-mode .topbar{background:rgba(255,253,247,.94)}
  body.book-mode .book{position:fixed;top:var(--bk-t);bottom:var(--bk-b);left:var(--bk-x);right:var(--bk-x);height:auto;overflow:visible;perspective:2600px}
  /* הכריכה הקשה — בולטת מסביב לדפים, צל על השולחן */
  body.book-mode .book::before{content:"";position:absolute;inset:-10px -12px -14px -12px;z-index:0;border-radius:10px;
    background:linear-gradient(135deg,#6B3F18 0%,#4E2D16 45%,#3A200E 100%);
    box-shadow:0 30px 60px -20px rgba(0,0,0,.6),0 8px 18px rgba(0,0,0,.35),inset 0 0 0 2px rgba(250,209,116,.35)}
  /* ערימת הדפים: קצוות שכבתיים בצד החופשי ובתחתית */
  body.book-mode .book::after{content:"";position:absolute;inset:0;z-index:0;border-radius:3px;background:#F3EAD2;
    box-shadow:calc(var(--bk-sign) * -2px) 2px 0 #E6DABB,calc(var(--bk-sign) * -4px) 4px 0 #F1E7CD,calc(var(--bk-sign) * -5px) 5px 0 #D9CBA6,calc(var(--bk-sign) * -7px) 7px 0 #EEE3C6,calc(var(--bk-sign) * -8px) 8px 0 #CFBE95}
  body.book-mode .page{padding-bottom:124px}
  /* צל השדרה — עמוק יותר, כמו דף שנכנס לכריכה (שכבה קבועה מעל הדף, לא נגללת איתו) */
  body.book-mode .page::before{display:none}
  body.book-mode .book .spine-shade{display:block}
  body.book-mode .page.is-turning{box-shadow:none;transition:none}
  /* מחליף את קיפול הפינה של 28.09 */
  body.book-mode .page.is-curling{clip-path:none}
  body.book-mode #curl{display:none;position:absolute;top:0;bottom:0;left:0;width:90px;height:auto!important;z-index:99;pointer-events:none;clip-path:none;filter:none;
    background:linear-gradient(to left,rgba(40,22,8,.45),rgba(40,22,8,0))}
  html[dir="ltr"] body.book-mode #curl{right:auto;clip-path:none;filter:none;background:linear-gradient(to right,rgba(40,22,8,.45),rgba(40,22,8,0))}
  /* במה משותפת לכריכה, לגב הדף ולצל השדרה — באותה פרספקטיבה ובאותו מלבן כמו הספר */
  #leaf-stage{display:block;position:fixed;top:var(--bk-t);bottom:var(--bk-b);left:var(--bk-x);right:var(--bk-x);perspective:2600px;pointer-events:none;z-index:45}
  #leaf-stage .spine{position:absolute;inset-block:0;right:0;width:56px;background:linear-gradient(to left,rgba(58,32,14,.45),rgba(58,32,14,.12) 45%,rgba(58,32,14,0))}
  html[dir="ltr"] #leaf-stage .spine{right:auto;left:0;background:linear-gradient(to right,rgba(58,32,14,.45),rgba(58,32,14,.12) 45%,rgba(58,32,14,0))}
  #leaf{position:absolute;inset:0;display:none;backface-visibility:visible;transform-origin:right center;
    background:linear-gradient(to left,#E9DDBE 0%,#FBF4E2 30%,#FFF9EC 70%,#EFE4C8 100%);box-shadow:0 10px 30px rgba(40,22,8,.25)}
  html[dir="ltr"] #leaf{transform-origin:left center;background:linear-gradient(to right,#E9DDBE 0%,#FBF4E2 30%,#FFF9EC 70%,#EFE4C8 100%)}
  #leaf.is-cover{inset:-10px -12px -14px -12px;border-radius:10px;background:linear-gradient(to left,#2E1809,#4A2A12 30%,#E9DDBE 31%,#FBF4E2 60%,#EFE4C8)}
  html[dir="ltr"] #leaf.is-cover{background:linear-gradient(to right,#2E1809,#4A2A12 30%,#E9DDBE 31%,#FBF4E2 60%,#EFE4C8)}
  /* הכריכה */
  #cover{display:grid;place-items:center;position:absolute;inset:-10px -12px -14px -12px;border-radius:10px;cursor:pointer;pointer-events:auto;
    transform-origin:right center;backface-visibility:hidden;color:#FCE7B0;text-align:center;
    background:radial-gradient(ellipse 60% 50% at 50% 42%,rgba(250,209,116,.20),rgba(0,0,0,0) 70%),linear-gradient(135deg,#6B3F18 0%,#4E2D16 45%,#3A200E 100%);
    box-shadow:0 30px 60px -20px rgba(0,0,0,.6),inset 0 0 0 2px rgba(250,209,116,.35)}
  html[dir="ltr"] #cover{transform-origin:left center}
  #cover::before{content:"";position:absolute;inset:26px;border:2px solid rgba(250,209,116,.55);border-radius:6px;box-shadow:inset 0 0 0 8px rgba(0,0,0,0),inset 0 0 0 10px rgba(250,209,116,.28)}
  #cover::after{content:"";position:absolute;inset-block:0;right:0;width:34px;border-radius:0 10px 10px 0;
    background:repeating-linear-gradient(180deg,rgba(0,0,0,.18) 0 2px,rgba(0,0,0,0) 2px 26px),linear-gradient(to left,rgba(0,0,0,.35),rgba(0,0,0,.05))}
  html[dir="ltr"] #cover::after{right:auto;left:0;border-radius:10px 0 0 10px;background:repeating-linear-gradient(180deg,rgba(0,0,0,.18) 0 2px,rgba(0,0,0,0) 2px 26px),linear-gradient(to right,rgba(0,0,0,.35),rgba(0,0,0,.05))}
  #cover .cv{position:relative;z-index:1;display:grid;justify-items:center;gap:10px;padding:24px}
  #cover .cv-logo{display:block;width:200px;height:200px;border-radius:50%;background:url(media/logo-crown-512.png) center 55%/82% no-repeat,radial-gradient(circle,#FFF8E6 0%,#FEF2D7 70%);box-shadow:0 0 0 4px rgba(250,209,116,.7),0 10px 24px rgba(0,0,0,.35)}
  #cover .cv-title{font-size:3.4rem;font-weight:700;line-height:1.1;margin:10px 0 0;color:#FAD174;text-shadow:0 2px 0 #2A1608,0 0 18px rgba(250,209,116,.25)}
  #cover .cv-sub{font-size:1.2rem;font-weight:500;margin:0;color:#FCE7B0}
  #cover .cv-open{margin-top:22px;font-size:1rem;font-weight:700;color:#3A200E;background:linear-gradient(160deg,#F6CC66,#E2B24C);padding:10px 28px;
    clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,14px 100%,0 50%)}
  #cover.is-gone{display:none}
  /* המונה והחצים — בתוך הספר, מעל קצה הדף; לא מסתירים שורות (לדפים יש padding-bottom) */
  body.book-mode .book-nav{bottom:calc(var(--bk-b) + 14px)}
  body.book-mode .sticky{bottom:calc(var(--bk-b) + 84px)}
  /* דף 3 (שתי הקבוצות): הכיתוב למעלה באותו גובה בשתי הקבוצות, התמונות למטה וקטנות יותר */
  body.book-mode .page[data-bg="babies"] .cards{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto auto auto;align-items:start}
  body.book-mode .page[data-bg="babies"] .card{display:grid;grid-row:span 3;grid-template-rows:subgrid;row-gap:8px;justify-items:center}
  body.book-mode .page[data-bg="babies"] .card h2{align-self:end;margin:0}
  body.book-mode .page[data-bg="babies"] .card p{margin:0}
  body.book-mode .page[data-bg="babies"] .card .btn{align-self:start}
  body.book-mode .page[data-bg="babies"] .comb{max-width:400px;margin-top:18px}
}
.page .comb .ph img[src$="infants-play.jpg"]{object-position:50% 75%}
.page .comb .ph img[src$="changing-station.jpg"]{object-position:55% 60%}
/* לוח החגים — "לחצו לפתיחה" גלוי, כמו כפתור (30.09, יגאל: לא היה ברור שזה נפתח) */
.page details.holidays{border:2px solid var(--honey);border-radius:14px;background:rgba(254,242,215,.85);padding:0 12px;margin-block:10px}
.page details.holidays summary{flex-wrap:wrap}
.page details.holidays summary::after{content:attr(data-open) " ▾";font-size:.85rem;font-weight:700;background:linear-gradient(160deg,#F6CC66,#E2B24C);color:var(--honey-deep);padding:4px 14px;border-radius:999px;text-shadow:none}
.page details.holidays[open] summary::after{content:attr(data-close) " ▴"}
@media (prefers-reduced-motion:reduce){#leaf-stage{display:none!important}}
body.cover-on .book-nav,body.cover-on .sticky,body.cover-on #bee{opacity:0;pointer-events:none}
/* 30.09 ערב — הדף המתעקל (book.js: turn): רצועות מקוננות, פנים = עותק הדף, גב = נייר */
.curl-root{position:absolute;inset:0;transform-style:preserve-3d}
.curl-strip{position:absolute;top:0;height:100%;transform-style:preserve-3d;transform-origin:right center}
html[dir="ltr"] .curl-strip{transform-origin:left center}
.curl-face{position:absolute;top:0;bottom:0;width:calc(100% + 3px);right:-1px;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden}
html[dir="ltr"] .curl-face{right:auto;left:-1px}
.curl-back{position:absolute;top:0;bottom:0;width:calc(100% + 3px);right:-1px;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:rotateY(180deg);background:linear-gradient(to left,#EFE4C8,#FFF9EC 50%,#F4EAD0)}
html[dir="ltr"] .curl-back{right:auto;left:-1px}
.curl-clone .ph:hover{transform:none}
/* 30.09 ערב (יגאל): כל תמונה גדלה ב-20% ובולטת כשמרחפים עליה (רק עם עכבר) */
@media (hover:hover) and (pointer:fine){
  .page .ph{position:relative;transition:transform .28s cubic-bezier(.2,.8,.2,1),filter .28s ease}
  .page .ph:hover{transform:scale(1.2);z-index:30;filter:saturate(1.15) brightness(1.05)}
  .page .comb:has(.ph:hover),.page .gallery:has(.ph:hover),.page .hero-art:has(.ph:hover){filter:drop-shadow(0 14px 18px rgba(58,32,14,.35))}
}
/* 30.09 לילה — דפדוף כפולה (יגאל, לפי סרטון Page Turn): השדרה באמצע; צל השדרה מופיע רק בזמן הדפדוף */
#leaf-stage .spine,html[dir="ltr"] #leaf-stage .spine{right:auto;left:50%;width:120px;transform:translateX(-50%);opacity:0;transition:opacity .25s;
  background:linear-gradient(to right,rgba(58,32,14,0),rgba(58,32,14,.28) 45%,rgba(58,32,14,.38) 50%,rgba(58,32,14,.28) 55%,rgba(58,32,14,0))}
#leaf-stage.is-turning .spine{opacity:1}
.curl-fixed{transform:translateZ(0)}
#leaf-stage{perspective:3600px}
/* 30.09 לילה — דיוקן אנה (תמונה 260 מדף הפייסבוק, ממתין לאישור שלה) — גדול יותר בספר */
.page .portrait{width:170px;height:190px;padding:5px}
.page .portrait img{object-position:50% 20%}
/* 30.09 לילה — הצללה רציפה על הדף המתהפך (במקום filter לרצועה, שיצר פסים) */
.curl-shade{position:absolute;inset:0;pointer-events:none;z-index:2}
.curl-back{overflow:hidden}
/* 30.09 — בטלפון הדיוקן מעל טקסט האודות (ליד הטקסט הוא נדחס לטור צר) */
@media (hover:none),(max-width:899px){.page .about-row{flex-direction:column;align-items:center;text-align:start}.page .about-row p{width:100%}}
