/* Grow upward while easing right within the section’s safe edge. */
#growth.growth-reference{overflow:clip}
#growth .growth-feeding{position:absolute;left:69%;top:21.5%;width:28%;height:min(64%,calc(78.5% - 136px));z-index:7;--tada-scale:.6;--tada-shift-x:0px}
#growth .growth-feed-character{position:relative;width:100%;height:100%;padding:0;background:none;border:0;border-radius:40%;display:block;cursor:pointer;touch-action:manipulation;user-select:none;-webkit-user-select:none;transform:translateX(var(--tada-shift-x)) scale(var(--tada-scale));transform-origin:100% 100%;transition:transform .65s cubic-bezier(.22,1,.36,1)}
#growth .growth-feed-character:disabled{cursor:default}
#growth .growth-feed-character[aria-busy="true"]{cursor:progress}
#growth .growth-feed-character:focus-visible{outline:3px dashed #087bd4;outline-offset:-4px}
#growth .growth-feed-art{position:absolute;inset:0;display:block;pointer-events:none;transition:transform .2s ease}
#growth .growth-feed-character:is(:hover,:focus-visible):not(:disabled) .growth-feed-art{transform:translateY(-3px)}
#growth .growth-feed-bubble{position:absolute;z-index:9;left:var(--feed-bubble-x,60%);top:var(--feed-bubble-y,35%);display:inline-flex;align-items:center;gap:7px;padding:11px 16px;border:1px solid #fff;border-radius:18px 18px 5px 18px;background:#fffffff5;box-shadow:0 5px 20px #14628a20;color:#e9093d;font-size:14px;font-weight:700;white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;transform:translate(-100%,calc(-100% - 2px)) scale(.96);transform-origin:100% 100%;transition:left .65s cubic-bezier(.22,1,.36,1),top .65s cubic-bezier(.22,1,.36,1),opacity .2s ease,transform .2s ease,visibility .2s}
#growth .growth-feed-bubble::after{content:'';position:absolute;right:10px;bottom:-5px;width:10px;height:10px;transform:rotate(45deg);border-radius:0 0 3px 0;background:#fff}
#growth .growth-bubble-spoon{width:20px;height:20px;flex:none}
#growth .growth-bubble-touch{display:none}
#growth .growth-feeding[data-ready="true"]:is(:has(.growth-feed-character:hover:not(:disabled)),:has(.growth-feed-character:focus-visible),[data-phase="eating"],[data-phase="growing"],[data-phase="complete"]) .growth-feed-bubble{opacity:1;visibility:visible;transform:translate(-100%,calc(-100% - 8px)) scale(1)}
#growth .growth-feed-art canvas,#growth .growth-feed-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;display:block;user-select:none;-webkit-user-drag:none}
#growth .growth-feed-art canvas{visibility:hidden}
#growth .growth-feeding[data-ready="true"] canvas{visibility:visible}
#growth .growth-feeding[data-ready="true"] .growth-feed-fallback{visibility:hidden}
#growth .growth-feed-feedback{position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%);width:min(250px,90%);text-align:center;color:#13344b;background:#ffffffe6;border:1px solid #ffffffde;box-shadow:0 5px 18px #27799e10;border-radius:17px;padding:8px 12px;backdrop-filter:blur(8px)}
#growth .growth-feed-hint{margin:0 0 10px;font-size:clamp(11px,.8vw,15px);font-weight:600;line-height:1.35;min-height:1.35em;white-space:nowrap}
#growth .growth-feeding[data-phase="ready"] .growth-feed-hint::before{content:'↗';display:inline-block;margin-right:6px;color:#ff073f}
#growth .growth-progress-label{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:clamp(10px,.65vw,12px);font-weight:500;margin:0 0 6px;color:#315571}
#growth #growth-percentage{font-variant-numeric:tabular-nums;font-weight:700;color:#e90039}
#growth #growth-progress{appearance:none;-webkit-appearance:none;border:1px solid #ffffffc9;background:#ffffffc9;box-shadow:0 2px 9px #167cc510;border-radius:99px;height:9px;width:100%;display:block;overflow:hidden;color:#ff073f}
#growth #growth-progress::-webkit-progress-bar{background:#ffffffc9;border-radius:99px}
#growth #growth-progress::-webkit-progress-value{background:linear-gradient(90deg,#ff5370,#ff073f);border-radius:99px;transition:width .65s cubic-bezier(.22,1,.36,1)}
#growth #growth-progress::-moz-progress-bar{background:linear-gradient(90deg,#ff5370,#ff073f);border-radius:99px}
#growth .growth-feed-reset{font-size:10px;font-weight:600;background:#ffffffe6;border:1px solid #ffffffc9;color:#163c57;border-radius:99px;padding:7px 13px;margin-top:9px;min-height:32px}
#growth .growth-feed-reset span{margin-left:5px}
#growth .growth-feed-reset:hover{background:#fff}
#growth .growth-feeding[data-phase="complete"] .growth-feed-hint{color:#db0736}
#growth .growth-feed-spark{position:absolute;pointer-events:none;color:#ffcd35;opacity:0;font-size:28px;text-shadow:0 2px 8px #ffffffbb}
#growth .spark-one{top:25%;left:12%}#growth .spark-two{top:61%;right:7%;font-size:35px}
#growth .growth-feeding[data-phase="complete"] .growth-feed-spark{animation:growth-spark .9s ease-out both}
@keyframes growth-spark{0%{opacity:0;transform:translateY(8px) scale(.4)}45%{opacity:1;transform:translateY(-8px) scale(1.15)}100%{opacity:0;transform:translateY(-22px) scale(.8)}}
@media(min-width:761px) and (max-aspect-ratio:7/5){
  #growth .growth-feeding{left:66%;top:26%;bottom:calc(24% + 120px);width:32%;height:auto}
  #growth .growth-feed-feedback{top:calc(100% + 3px);width:min(215px,85%)}
  #growth .growth-feed-hint{margin-bottom:7px}
}
@media(min-width:761px) and (max-aspect-ratio:7/5) and (max-height:800px){
  #growth .growth-feeding{top:14%;bottom:calc(33% + 120px)}
}
@media(max-width:760px){
  #growth .growth-feeding{left:calc(50% - 32px);top:365px;width:calc(50% + 16px);height:250px}
  #growth .growth-feed-feedback{top:calc(100% + 6px);width:min(190px,90%)}
  #growth .growth-feed-hint{font-size:10px;margin-bottom:8px}
  #growth .growth-progress-label{font-size:9px}
  #growth .growth-feed-reset{margin-top:7px;padding:6px 12px;min-height:32px}
}
@media(prefers-reduced-motion:reduce){
  #growth .growth-feed-character,#growth .growth-feed-art,#growth .growth-feed-bubble,#growth #growth-progress::-webkit-progress-value{transition:none}
  #growth .growth-feed-character:is(:hover,:focus-visible):not(:disabled) .growth-feed-art{transform:none}
  #growth .growth-feed-spark{animation:none!important}
}
@media(max-width:760px),(hover:none),(pointer:coarse){
  #growth .growth-feeding[data-ready="true"] .growth-feed-bubble{opacity:1;visibility:visible;transform:translate(-100%,calc(-100% - 8px)) scale(1)}
  #growth .growth-feed-bubble{font-size:12px;padding:9px 12px;gap:5px}
  #growth .growth-bubble-spoon{width:17px;height:17px}
  #growth .growth-bubble-desktop{display:none}
  #growth .growth-bubble-touch{display:inline}
}
