/* ==========================================================
   לומי וטאז · עיצוב משותף לכל הדפים
   RTL · Rubik לכל הטקסט · Secular One רק בלוגו · בלי לבנדר
   ========================================================== */

:root{
  --ink:#3B2D52;          /* טקסט וכפתורים */
  --ink-soft:#5A4A73;     /* טקסט משני */
  --cream:#FFFDF8;        /* רקע */
  --cream-2:#FBF5EA;      /* רקע סקשנים */
  --pink:#E879A6;         /* חשבון */
  --pink-dark:#C93F78;    /* שם ״לומי:״ בבועות */
  --blue:#A9CDEB;         /* אנגלית */
  --yellow:#F6D36B;       /* מרקר והדגשה */
  --lumi:#F4A9C8;
  --taz:#AEE0CC;
  --green:#2E8F6E;        /* הצלחה */
  --red:#E03E3E;          /* טעות */
  --red-soft:#FDE3E3;
  --line:#E6DFD3;         /* מסגרות */
  --sage:#A9C4A5;
  --font:'Rubik',system-ui,sans-serif;
  --logo:'Secular One','Rubik',sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--font);font-size:20px;line-height:1.6;overflow-x:clip}
img,video{max-width:100%}
a{color:var(--ink)}
a:hover{color:#6B4F8F}
button{font-family:inherit;color:inherit}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}

/* אף פעם לא מילה אחת לבד בשורה */
h1,h2,h3,.balance{text-wrap:balance}
p,li,dd,figcaption,label,summary,.pretty{text-wrap:pretty}

h1,h2,h3{margin:0;font-weight:800;line-height:1.2}
h2{font-size:36px}
p{margin:0}

.wrap{max-width:1200px;margin:0 auto;padding:88px 24px}
.stack{display:flex;flex-direction:column}
.center{text-align:center}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* מרקר צהוב מאחורי מילה או שתיים */
.mark{background:linear-gradient(transparent 55%,var(--yellow) 55%);padding:0 6px;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* ---------- כפתורים ותגיות ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 30px;border-radius:999px;font-size:19px;font-weight:700;text-decoration:none;cursor:pointer;border:2px solid var(--ink);background:transparent;color:var(--ink);line-height:1.2;text-align:center}
.btn--dark{background:var(--ink);color:var(--cream)}
.btn--dark:hover{color:var(--cream);background:#4A3966}
.btn--pink{background:var(--pink);border-color:var(--pink);color:var(--ink);font-weight:800;box-shadow:0 5px 0 rgba(59,45,82,.18)}
.btn--sm{min-height:44px;padding:0 24px;font-size:17px}

.tag{display:inline-flex;align-items:center;gap:6px;font-size:17px;font-weight:700;padding:6px 18px;border-radius:999px;box-shadow:0 3px 0 rgba(59,45,82,.18);white-space:nowrap}
.tag--math{background:var(--pink)}
.tag--eng{background:var(--blue)}
.tag--yellow{background:var(--yellow)}
.tag--print{background:#fff;border:2px solid var(--ink);box-shadow:none;padding:4px 16px}
.tag--sm{font-size:15px;padding:3px 14px;box-shadow:none}
.tags{display:flex;flex-wrap:wrap;gap:10px}
.tags .tag:nth-child(1){transform:rotate(-2deg)}
.tags .tag:nth-child(2){transform:rotate(2deg)}
.tags .tag:nth-child(3){transform:rotate(-1deg)}
.tags--flat .tag{transform:none !important}

.label-dark{align-self:flex-start;font-weight:700;background:var(--ink);color:var(--cream);border-radius:12px;padding:8px 22px;font-size:20px;transform:rotate(-2deg);box-shadow:0 4px 10px rgba(59,45,82,.22)}
.pill-note{align-self:flex-start;font-size:16px;font-weight:700;padding:5px 16px;background:var(--ink);color:var(--cream);border-radius:999px;transform:rotate(-2deg)}
.placeholder-text{background:#FFF1B8;outline:2px dashed #D8A800;outline-offset:1px;border-radius:4px;padding:0 4px}

/* ---------- כותרת עליונה ---------- */
.site-header{border-bottom:1px solid var(--line);background:var(--cream);position:relative;z-index:50}
.site-header__in{max-width:1200px;margin:0 auto;padding:18px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px 32px}
.logo{position:relative;display:inline-flex;align-items:baseline;gap:.12em;font-family:var(--logo);font-size:40px;line-height:1;padding-bottom:12px;text-decoration:none;color:var(--ink)}
.logo:hover{color:var(--ink)}
.logo__amp{color:var(--pink);font-size:.62em}
.logo__small{font-size:.62em}
.logo svg{position:absolute;right:-2%;bottom:0;width:104%;height:9px}
.nav-main{display:flex;flex-wrap:wrap;align-items:center;gap:8px 28px;font-size:18px;font-weight:500}
.nav-main a{text-decoration:none}
.nav-main .btn{min-height:44px;padding:0 22px;font-size:18px}
.burger{display:none;width:44px;height:44px;padding:0;border:2px solid var(--ink);border-radius:12px;background:#fff;align-items:center;justify-content:center;cursor:pointer;margin-inline-start:auto}
.burger .ic-close{display:none}
.burger[aria-expanded="true"] .ic-open{display:none}
.burger[aria-expanded="true"] .ic-close{display:block}
.m-menu{display:none;flex-direction:column;padding:4px 16px 18px;background:var(--cream);border-top:1px solid var(--line);box-shadow:0 12px 20px rgba(59,45,82,.12);position:absolute;left:0;right:0;top:100%}
.m-menu a{display:flex;align-items:center;min-height:52px;border-bottom:1px solid var(--line);font-size:19px;font-weight:700;text-decoration:none}
.m-menu .btn{margin-top:12px;border-bottom:0;justify-content:center;font-size:18px}
.m-menu.is-open{display:flex}

@media (max-width:560px){
  .site-header__in{padding:12px 16px;gap:10px}
  .nav-main{display:none}
  .burger{display:flex}
  .logo{font-size:34px}
}

/* ---------- הירו ---------- */
.hero{position:relative;overflow:hidden;background:var(--cream-2);border-bottom:1px solid #EFE3CC}
.hero__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hero__fade{position:absolute;inset:0;background:linear-gradient(270deg,rgba(251,245,234,.97) 0%,rgba(251,245,234,.92) 34%,rgba(251,245,234,.55) 50%,rgba(251,245,234,0) 64%);pointer-events:none}
.hero__in{position:relative;max-width:1200px;margin:0 auto;padding:64px 24px 96px;min-height:640px;display:flex;flex-direction:column;justify-content:center;gap:28px}
.hero__text{max-width:540px;display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.hero h1{font-size:56px;line-height:1.08}
.hero__text>p{font-size:20px;line-height:1.55}
.hero__btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.crumbs{font-size:15px;font-weight:500;color:var(--ink-soft)}

/* דף הבית: התמונה 78% משמאל, פייד שמנת מימין שלא עולה על טאז */
@media (min-width:761px){
  .hero--home .hero__media{width:78%;left:0;right:auto;object-position:20% 50%}
  .hero--home .hero__fade{background:linear-gradient(270deg,#FBF5EA 0%,#FBF5EA 22%,rgba(251,245,234,.75) 30%,rgba(251,245,234,0) 42%)}
}

/* דף משחק */
.hero--game .hero__in{justify-content:flex-start;padding-top:32px;min-height:620px}
.hero--game h1{font-size:72px;line-height:1.05}
.hero--game .hero__head{display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.hero--game .label-dark{font-size:24px;padding:10px 26px;border-radius:14px;transform:rotate(-3deg);box-shadow:0 6px 14px rgba(59,45,82,.28)}

@media (max-width:760px){
  .hero__media{position:static;height:auto;aspect-ratio:3/2}
  .hero__fade{display:none}
  .hero__in{min-height:0;padding-top:28px;padding-bottom:44px}
  .hero__text{max-width:none}
  .crumbs{display:none}
  /* במובייל: שם המשחק והתווית בפינה הימנית העליונה של התמונה, בלי פייד */
  .hero--game .hero__in{padding-top:22px;position:static}
  .hero__media{width:100%;background:#EFE3CC}
  .hero--game .hero__head{position:absolute;top:12px;right:14px;left:14px;gap:8px;z-index:2}
  .hero--game h1{font-size:30px;text-shadow:0 0 3px var(--cream),0 0 14px rgba(255,253,248,.95)}
  .hero--game .label-dark{font-size:14px;padding:5px 12px;border-radius:10px}
}
@media (max-width:560px){
  .hero--home h1{font-size:36px}
  .hero__text>p{font-size:17px}
  .hero .tags{flex-wrap:nowrap;gap:6px}
  .hero .tag{font-size:14px;padding:4px 11px;box-shadow:none}
  .hero .tag svg{width:15px;height:15px}
  .hero .label-dark{font-size:16px;padding:6px 16px}
  .hero--game .label-dark{font-size:14px;padding:5px 12px}
  .hero__btns .btn{min-height:48px;padding:0 22px;font-size:17px}
}

/* ---------- סקשנים כלליים ---------- */
.sec-white{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sec-cream2{background:var(--cream-2);border-top:1px solid #EFE3CC;border-bottom:1px solid #EFE3CC}
.sec-pink{background:#FCE8F0;border-top:1px solid #F3C9DA;border-bottom:1px solid #F3C9DA}
.sec-blue{background:#E6F1FA;border-top:1px solid #C9DEF0;border-bottom:1px solid #C9DEF0}
.sec-title-row{display:flex;flex-direction:column;gap:12px}
.lead{font-size:19px;max-width:760px}

@media (max-width:560px){
  h2{font-size:28px}
  .wrap{padding:44px 16px}
}

/* ---------- בועות דיבור ----------
   בועה לבנה, מסגרת סגולה, זנב שמתחבר בלי קו חוצה.
   הרוחב תמיד לפי הטקסט: js/site.js מכווץ את הבועה לשורה הארוכה ביותר. */
.bubble{position:relative;display:block;width:fit-content;max-width:100%;margin:0;padding:14px 22px;background:#fff;border:3px solid var(--ink);border-radius:22px;font-size:20px;font-weight:700;line-height:1.45;box-shadow:0 6px 0 rgba(59,45,82,.12);text-wrap:balance}
.bubble .who-lumi{color:var(--pink-dark)}
.bubble .who-taz{color:var(--green)}
.bubble .tail{position:absolute;overflow:visible;pointer-events:none}
.bubble .tail .fill{fill:#fff}
.bubble--miss{background:var(--red-soft)}
.bubble--miss .tail .fill{fill:var(--red-soft)}
.oops-tag{display:inline-block;margin-inline-end:6px;padding:0 8px;background:var(--red);color:#fff;border-radius:8px;font-weight:800;transform:rotate(-3deg)}
.yes-word{display:inline-block;padding:0 3px;border-radius:6px;transform-origin:center;animation:yesPop 1.4s ease-in-out var(--d,.35s) both}
.ltr{unicode-bidi:isolate;direction:ltr}

/* ---------- סיפור אינטראקטיבי ---------- */
.story{background:var(--cream)}
.story .wrap{padding-top:72px;padding-bottom:72px;gap:28px;display:flex;flex-direction:column}
.story h2{text-align:center}
.story .lead{margin:-14px auto 0;max-width:560px;text-align:center}
.story-stage{touch-action:pan-y;display:flex;align-items:flex-end;justify-content:center;gap:24px}
.story-char{flex:none;width:220px;height:auto;display:block;transition:transform .3s,opacity .3s;opacity:.6}
.story-char.is-talking{opacity:1;animation:hop 1.4s ease-in-out infinite}
.story-lines{flex:1 1 520px;min-width:0;max-width:620px;min-height:300px;display:flex;flex-direction:column;justify-content:flex-end;gap:16px;padding-bottom:12px}
.story-lines .bubble{opacity:.55}
.story-lines .bubble.is-current{opacity:1}
.story-lines .bubble--lumi{align-self:flex-start;margin-right:18px}
.story-lines .bubble--taz{align-self:flex-end;margin-left:18px}
.story-lines .bubble--lumi.is-current{animation:sinR .55s cubic-bezier(.2,.9,.3,1.3) both,sfloat 3s ease-in-out .6s infinite}
.story-lines .bubble--taz.is-current{animation:sinL .55s cubic-bezier(.2,.9,.3,1.3) both,sfloat 3s ease-in-out .6s infinite}
.story-controls{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px}
.story-controls .btn{min-height:56px;padding:0 34px;font-size:20px}
.story-next.is-first{animation:nudge 1.6s ease-in-out infinite}
.swipe-hint{display:none;flex-basis:100%;text-align:center;font-size:15px;font-weight:500;color:var(--ink-soft)}
.dots{display:flex;justify-content:center;gap:8px;flex-basis:100%}
.dot{width:12px;height:12px;border-radius:50%;border:2px solid var(--ink);background:#fff}
.dot.is-on{background:var(--yellow)}
.dot--lg{width:16px;height:16px;border-width:3px}
/* זנבות: בצד בדסקטופ, כלפי מטה במובייל */
.tail-down{display:none}
@media (max-width:760px){
  .story-stage{flex-wrap:wrap;justify-content:space-between;gap:0}
  .story-char{width:130px}
  .story-lines{order:-1;flex-basis:100%;min-height:0;padding-bottom:36px}
  .story-lines .bubble:not(.is-current){display:none}
  .story-lines .bubble{margin:0 !important;font-size:17px;padding:12px 18px}
  .story-lines .tail-side{display:none}
  .story-lines .tail-down{display:block}
  .swipe-hint{display:block}
}

/* ---------- נסו עכשיו ---------- */
.try .wrap{padding-top:72px;padding-bottom:72px;display:flex;flex-direction:column;gap:28px}
.try__head{display:flex;flex-direction:column;gap:10px}
.try-arrow{display:inline-block;vertical-align:middle;margin-inline-start:10px;animation:arrowBob 1.2s ease-in-out infinite}
.only-mob{display:none}
@media (max-width:560px){.only-mob{display:inline}.only-desk{display:none}}
.board{position:relative;background:var(--cream);border-radius:28px;padding:28px;display:flex;flex-direction:column;gap:24px;box-shadow:0 10px 28px rgba(59,45,82,.10)}
.board__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.board__cap{font-size:16px;font-weight:700;color:var(--ink-soft)}
.progress{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:700}

/* תגובות הדמויות */
.feed{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 32px;min-height:170px}
.feed__in{display:contents}
.feed-x{display:none}
.say{flex:0 1 440px;min-width:0;display:flex;flex-direction:column;gap:30px;opacity:0}
.say.is-in{animation:popA .45s var(--d,0s) both}
.say.is-shake{animation:shake .4s var(--d,0s) both;opacity:1}
.say--lumi{align-items:flex-start;order:1}
.say--taz{align-items:flex-end;order:2}
.say .bubble{font-size:19px;padding:16px 22px;border-radius:20px;line-height:1.5}
.say .face{width:78px;height:78px;margin:0 18px;display:block}

/* ״נכון!״ גדול עם הפרצוף של לומי */
.yes-toast{position:absolute;z-index:40;top:-34px;left:50%;display:flex;align-items:center;gap:4px;pointer-events:none;animation:yesToast 2.2s ease-out both}
.yes-toast__word{padding:10px 26px;background:#fff;border:3px solid var(--green);border-radius:22px;font-size:40px;font-weight:800;line-height:1;color:var(--green);white-space:nowrap;box-shadow:0 8px 20px rgba(46,143,110,.3)}
.yes-toast img{width:70px;height:70px;display:block}

/* סיום */
.win-box{align-self:center;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:18px 28px;background:var(--yellow);border-radius:24px;box-shadow:0 6px 0 rgba(59,45,82,.18);animation:winPop .6s cubic-bezier(.2,.9,.3,1.4) both}
.win-box strong{font-size:30px;font-weight:800;line-height:1.15}
.win-box span{font-size:18px;font-weight:500}
.win-btns{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px}
.confetti{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:3;border-radius:28px}
.confetti i{position:absolute;top:-20px;border-radius:2px;animation:confA var(--t,3s) ease-in var(--d,0s) 2 both}
.hidden{display:none !important}

@media (max-width:560px){
  .board{padding:16px}
  /* במובייל הבועות הן פופאפ שצף בתחתית המסך, לא תופס מקום ולא חוסם נגיעות */
  .feed{position:sticky;bottom:12px;height:0;min-height:0;overflow:visible;z-index:25;display:block;margin:0;order:4}
  .feed__in{pointer-events:none;position:absolute;bottom:0;left:0;right:0;display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:10px 6px 4px;transition:opacity .35s,transform .35s}
  .feed__in.is-hidden{opacity:0;transform:translateY(16px)}
  .feed-x{pointer-events:auto;display:flex;align-self:flex-start;align-items:center;justify-content:center;width:36px;height:36px;margin-bottom:-6px;border:0;border-radius:50%;background:var(--ink);color:var(--cream);font-size:16px;cursor:pointer;box-shadow:0 3px 8px rgba(59,45,82,.25)}
  .say{flex:none;gap:26px;order:0}
  .say .face{width:56px;height:56px;margin:0 12px}
  .say .bubble{font-size:16px;padding:8px 14px;border-width:2px;box-shadow:0 4px 12px rgba(59,45,82,.18)}
  .feed.is-start{display:none}
  /* בסיום הבועות נשארות קבועות מתחת לכפתורים */
  .feed.is-won{position:static;height:auto;order:6}
  .feed.is-won .feed__in{position:static;opacity:1;transform:none}
  .feed.is-won .feed-x{display:none}
  .board>.hand{order:3}
  .board>.win{order:5}
  .win-box strong{font-size:24px}
}

/* ---------- מה בערכה ---------- */
.kit .wrap{padding-top:80px;padding-bottom:80px;display:flex;flex-direction:column;gap:36px}
.steps-box{align-self:flex-start;display:flex;align-items:center;gap:12px;padding:10px 18px;background:#fff;border:2px dashed var(--pink);border-radius:16px;font-size:18px;font-weight:700}
.steps-box span{display:inline-flex;align-items:center;gap:6px}
.steps-box .arr{color:var(--pink);font-size:20px}
.kit-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 64px}
.kit-grid li{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.kit-page{position:relative;width:100%;aspect-ratio:794/1123}
.kit-page img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#fff;border-radius:4px;box-shadow:0 8px 18px rgba(59,45,82,.18)}
.kit-page img.under{transform:translate(-16px,10px) rotate(-5deg);box-shadow:0 6px 14px rgba(59,45,82,.14)}
.kit-page .num{position:absolute;top:-10px;right:-6px;min-width:32px;height:32px;padding:0 8px;border-radius:999px;background:var(--pink);font-size:16px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 0 rgba(59,45,82,.2);z-index:2}
.kit-name{font-size:17px;font-weight:700;line-height:1.3}
.kit-desc{font-size:15px;line-height:1.35;margin-top:-6px}
.kit-plus{font-size:18px;font-weight:500}
.kit-plus strong{font-weight:800}
.kit-note{font-size:16px;color:var(--ink-soft)}
@media (max-width:560px){
  .steps-box{font-size:15px;gap:6px;padding:8px 12px;white-space:nowrap}
  .steps-box svg{width:17px;height:17px}
  .kit-grid{gap:24px 14px}
  .kit-name{font-size:14px}
  .kit-desc{display:none}
}

/* ---------- קבלת המשחק ---------- */
.get .wrap{max-width:760px;padding-top:72px;padding-bottom:72px;display:flex;flex-direction:column;gap:20px}
.get h2,.get .lead{text-align:center}
.get .lead{margin-top:-6px}
.signup{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:28px;background:var(--cream);border:1px solid var(--line);border-radius:24px}
.signup__row{width:100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:12px}
.field{flex:1 1 260px;display:flex;flex-direction:column;gap:6px}
.field label{font-size:16px;font-weight:700}
.input{min-height:52px;padding:0 18px;border:2px solid var(--ink);border-radius:999px;background:#fff;font-family:var(--font);font-size:18px;color:var(--ink);text-align:center;width:100%}
.signup .btn{flex:1 1 260px}
.fine{font-size:15px;font-weight:500;color:var(--ink-soft)}
.form-msg{font-size:17px;font-weight:700;color:var(--green)}
.form-msg.is-error{color:var(--red)}
.sale{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.sale__price{font-size:36px;font-weight:800;line-height:1.2}
[data-offer="gift"] .only-sale,[data-offer="sale"] .only-gift{display:none !important}

/* ---------- שאלות נפוצות ---------- */
.faq .wrap{max-width:860px;padding-top:80px;padding-bottom:80px;display:flex;flex-direction:column;gap:24px}
.faq__list{display:flex;flex-direction:column;gap:12px}
.faq details{padding:18px 24px;background:#fff;border:1px solid var(--line);border-radius:18px}
.faq summary{font-size:20px;font-weight:700;min-height:32px;cursor:pointer}
.faq details p{margin:12px 0 0;font-size:18px}

/* ---------- עוד משחקים ---------- */
.more .wrap{padding-top:80px;padding-bottom:80px;display:flex;flex-direction:column;gap:32px}
.more__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:24px}
.more-card{display:flex;flex-wrap:wrap;align-items:center;gap:20px;padding:24px;background:#fff;border:1px solid var(--line);border-radius:24px}
.more-card img{flex:0 0 120px;width:120px;height:120px;border-radius:18px;object-fit:cover}
.more-card div{flex:1 1 180px;display:flex;flex-direction:column;gap:8px}
.more-card h3{font-size:26px;font-weight:700;line-height:1.3}
.more-card a{font-size:17px;font-weight:700}

/* ---------- פוטר ---------- */
.site-footer{background:var(--ink);color:var(--cream)}
.site-footer__in{max-width:1200px;margin:0 auto;padding:18px 24px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px}
.site-footer .logo-sm{display:inline-flex;align-items:baseline;gap:.12em;font-family:var(--logo);font-size:22px;line-height:1}
.site-footer .logo-sm .logo__amp{color:var(--lumi)}
.site-footer nav{display:flex;flex-wrap:wrap;gap:4px 18px;font-size:14px}
.site-footer nav a{color:var(--line);text-decoration:none}
.site-footer nav a:hover{color:#fff}
@media (max-width:560px){.site-footer__in{flex-direction:column;justify-content:center;text-align:center}}

/* ---------- תמונה חסרה (עד שמעלים את המדיה) ---------- */
.img-missing{background:repeating-linear-gradient(45deg,#F7EFE1 0 12px,#FBF5EA 12px 24px) !important;outline:2px dashed #D9C9AE;outline-offset:-2px}

/* ---------- אנימציות ---------- */
@keyframes popA{0%{transform:scale(.8);opacity:0}70%{transform:scale(1.04)}100%{transform:scale(1);opacity:1}}
@keyframes wob{0%,100%{transform:rotate(0)}15%{transform:translateX(-10px) rotate(-6deg)}30%{transform:translateX(9px) rotate(5deg)}45%{transform:translateX(-7px) rotate(-4deg)}60%{transform:translateX(5px) rotate(3deg)}75%{transform:translateX(-2px)}}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
@keyframes sinR{0%{transform:translateX(60px) rotate(4deg) scale(.85);opacity:0}100%{transform:none;opacity:1}}
@keyframes sinL{0%{transform:translateX(-60px) rotate(-4deg) scale(.85);opacity:0}100%{transform:none;opacity:1}}
@keyframes sfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes hop{0%,100%{transform:translateY(-8px) scale(1.06)}50%{transform:translateY(-16px) scale(1.06)}}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(-6px)}}
@keyframes arrowBob{0%,100%{transform:translateY(-4px)}50%{transform:translateY(8px)}}
@keyframes yesPop{0%{transform:scale(1)}25%{transform:scale(1.9);color:var(--green);background:var(--yellow)}60%{transform:scale(1.9);color:var(--green);background:var(--yellow)}100%{transform:scale(1);background:transparent}}
@keyframes yesToast{0%{transform:translate(-50%,20px) scale(.5);opacity:0}15%{transform:translate(-50%,0) scale(1.15);opacity:1}25%{transform:translate(-50%,0) scale(1)}75%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-24px) scale(.95)}}
@keyframes winPop{0%{transform:scale(.5) rotate(-6deg);opacity:0}100%{transform:scale(1) rotate(-1deg);opacity:1}}
@keyframes confA{0%{transform:translateY(0) rotate(0);opacity:1}100%{transform:translateY(900px) rotate(540deg);opacity:0}}
@keyframes stamp{0%{transform:scale(2.2);opacity:0}55%{transform:scale(.92);opacity:1}100%{transform:scale(1);opacity:1}}
.anim-wob{animation:wob .6s ease-out}
.anim-pop{animation:popA .45s both}

/* ביטול אנימציות חוזרות למי שביקש פחות תנועה */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-iteration-count:1 !important}
  .story-char.is-talking,.story-next.is-first,.try-arrow,.trait,.quiz-opt,.quiz-pic,.story-lines .bubble{animation:none !important}
  .confetti{display:none}
}