/* 열매 타임어택 — 시계는 재촉하지 않고 조용히 줄어든다(실패가 없으므로). */
.fruit{position:fixed;inset:0;z-index:11;display:grid;grid-template-rows:auto 1fr;
  gap:8px;padding:10px 12px;background:rgba(24,18,10,.5);backdrop-filter:blur(2px)}

.fruit-top{display:flex;align-items:center;gap:10px}
.fruit-timer{flex:1;height:22px;background:rgba(255,255,255,.6);border:3px solid var(--wood);
  border-radius:999px;overflow:hidden}
.fruit-bar{display:block;height:100%;width:100%;border-radius:999px;
  background:linear-gradient(90deg,#e8a020,#f4c331);transition:width .1s linear}
.fruit-count{background:var(--panel);border:3px solid var(--wood);border-radius:999px;
  padding:4px 16px;font-variant-numeric:tabular-nums}

.fruit-field{position:relative;min-height:0}
.fruit-one{position:absolute;width:min(19vmin,110px);height:min(19vmin,110px);
  min-width:var(--touch);min-height:var(--touch);
  background:none;border:0;padding:0;cursor:pointer;transition:transform .1s}
.fruit-one:active{transform:scale(.9)}
.fruit-pic{width:100%;height:100%;object-fit:contain;display:block}
.fruit-fallback{border-radius:44%;border:4px solid rgba(0,0,0,.3)}
.fruit-one.got{animation:got .26s ease-out forwards;pointer-events:none}
@keyframes got{to{transform:translateY(-30%) scale(1.35);opacity:0}}

/* 끝났을 때 — "얼마나 땄나"만 보여준다. 못 땄다는 말은 없다. */
.fruit-done{position:fixed;inset:0;display:grid;place-items:center;gap:10px;grid-auto-flow:row;
  background:rgba(24,18,10,.66);cursor:pointer;animation:eggUp .4s cubic-bezier(.2,1.3,.4,1)}
.fruit-done-picked{font-size:1.6em;color:#fff;text-shadow:0 3px 0 rgba(0,0,0,.35)}
.fruit-done-line{display:flex;align-items:center;gap:8px;background:var(--panel);
  border:4px solid var(--wood);border-radius:999px;padding:10px 26px;font-size:.9em}
.fruit-done-line img{width:34px;height:34px}