/* iBOBRY 8.31 — contextual tutorial */
.tutorial-layer{position:fixed;inset:0;z-index:99999;display:none;pointer-events:none}
.tutorial-layer.open{display:block}
.tutorial-dim{position:absolute;inset:0;background:rgba(18,25,20,.58)}
.tutorial-focus{position:fixed;border:4px solid #ffe566;border-radius:20px;box-shadow:0 0 0 9999px rgba(18,25,20,.58),0 0 0 5px rgba(255,255,255,.72),0 0 28px #ffe566;animation:tutPulse 1s ease-in-out infinite;pointer-events:none}
.tutorial-arrow{position:fixed;font-size:34px;line-height:1;filter:drop-shadow(0 3px 2px #0007);color:#ffe566;z-index:3;animation:tutArrow .7s ease-in-out infinite alternate}
.tutorial-bubble{position:fixed;left:50%;transform:translateX(-50%);width:min(360px,86vw);min-height:70px;display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:9px;padding:10px 12px;border:4px solid #5b351f;border-radius:20px;background:linear-gradient(#fff9df,#efcf8b);box-shadow:0 7px 0 #472716,0 12px 26px #0005;z-index:4;pointer-events:auto}
.tutorial-beaver{font-size:38px}
.tutorial-text{font-size:15px;font-weight:1000;line-height:1.12;color:#452818}
.tutorial-skip{border:0;border-radius:12px;padding:8px 10px;background:#55b94d;color:white;font-weight:1000}
@keyframes tutPulse{50%{filter:brightness(1.18)}}
@keyframes tutArrow{to{transform:translateY(-7px)}}
@media(max-width:760px){.tutorial-bubble{grid-template-columns:42px 1fr auto;min-height:58px;padding:8px 9px}.tutorial-beaver{font-size:31px}.tutorial-text{font-size:12px}.tutorial-skip{font-size:10px;padding:7px}}

.beaver-first-intro{position:fixed;inset:0;z-index:99998;display:grid;place-items:center;background:rgba(25,38,29,.48);transition:.25s}
.beaver-first-intro.hide{opacity:0}
.beaver-first-card{width:min(360px,84vw);padding:20px 18px;border:5px solid #5c371f;border-radius:28px;background:linear-gradient(#fff8d9,#e9c57f);box-shadow:0 9px 0 #482817,0 18px 35px #0005;text-align:center;display:grid;gap:7px;color:#432716}
.beaver-first-face{font-size:58px}.beaver-first-card b{font-size:22px}.beaver-first-card span{font-size:14px;font-weight:800}

/* v8.32 — hint stays visual; highlighted control remains usable */
.tutorial-layer.open{pointer-events:none}
.tutorial-bubble,.tutorial-skip{pointer-events:auto}
.tutorial-focus{pointer-events:none}
@media(max-width:760px){
 .tutorial-bubble{width:min(330px,82vw)}
 .tutorial-text{max-width:190px}
}

/* v8.33 onboarding feedback */
#rewardScreen.first-log-reward .reward-coins{animation:firstLogFly .75s cubic-bezier(.2,.9,.25,1)}
@keyframes firstLogFly{0%{transform:translateY(35px) scale(.55);opacity:0}70%{transform:translateY(-7px) scale(1.12)}100%{transform:none;opacity:1}}
#rewardScreen.mini-unlock-reward .reward-card{animation:miniRewardGlow 1s ease-in-out 2}
@keyframes miniRewardGlow{50%{transform:scale(1.025);filter:brightness(1.13)}}
#miniHomeBtn.newly-unlocked{animation:miniHomeCall 1.2s ease-in-out infinite}
@keyframes miniHomeCall{50%{transform:translateY(-5px) scale(1.055);filter:brightness(1.15)}}
#miniSelectScreen .mini-choice.progress-locked{cursor:pointer!important;opacity:.68!important;filter:saturate(.6)!important}

/* v8.34 real Beaver icon instead of unsupported emoji square */
.tutorial-beaver,.beaver-first-face{display:grid;place-items:center}
.tutorial-beaver img{display:block;width:46px;height:46px;object-fit:contain;filter:drop-shadow(0 2px 1px rgba(65,36,20,.25))}
.beaver-first-face img{display:block;width:86px;height:86px;object-fit:contain;margin:auto;filter:drop-shadow(0 4px 2px rgba(65,36,20,.25))}
@media(max-width:760px){.tutorial-beaver img{width:38px;height:38px}.beaver-first-face img{width:74px;height:74px}}

/* v8.35 — approved Beaver head in tutorial hints */
.tutorial-beaver img{
  width:50px!important;
  height:50px!important;
  object-fit:contain!important;
}
.beaver-first-face img{
  width:96px!important;
  height:96px!important;
  object-fit:contain!important;
}
@media(max-width:760px){
  .tutorial-beaver img{width:42px!important;height:42px!important}
  .beaver-first-face img{width:82px!important;height:82px!important}
}