/* ===== Сад силы ===== */
body.garden-room {
  /* солнечная поляна с переливами: зелень, лайм, золото, персик и розовый блик */
  background:
    radial-gradient(560px 440px at 52% -4%, rgba(253,240,168,.82) 0%, transparent 52%),   /* яркое солнце */
    radial-gradient(520px 420px at 50% 14%, rgba(250,236,184,.5) 0%, transparent 58%),     /* тёплая дымка */
    radial-gradient(560px 540px at 14% 24%, rgba(116,168,70,.40) 0%, transparent 60%),     /* глубокая зелень слева */
    radial-gradient(560px 520px at 88% 28%, rgba(176,210,96,.36) 0%, transparent 60%),     /* лайм справа */
    radial-gradient(520px 440px at 80% 56%, rgba(246,196,146,.34) 0%, transparent 60%),    /* тёплый персиковый блик */
    radial-gradient(500px 420px at 20% 60%, rgba(220,162,182,.26) 0%, transparent 60%),    /* нежно-розовый перелив */
    radial-gradient(560px 460px at 50% 72%, rgba(150,202,150,.30) 0%, transparent 62%),    /* свежая зелень центр */
    radial-gradient(760px 500px at 50% 100%, rgba(190,216,100,.44) 0%, transparent 58%),   /* солнечная трава снизу */
    linear-gradient(162deg, #ecf3cc 0%, #e2eebc 28%, #e8e6bc 52%, #ecddb2 78%, #f0d6b2 100%) fixed;
}
/* живые переливы цвета: медленно дрейфующий многоцветный свет */
.garden-glow { position: fixed; inset: -25%; z-index: 0; pointer-events: none;
  background:
    radial-gradient(38% 42% at 28% 30%, rgba(255,226,140,.55), transparent 68%),
    radial-gradient(42% 46% at 72% 50%, rgba(168,222,124,.5), transparent 68%),
    radial-gradient(40% 44% at 48% 82%, rgba(246,188,156,.46), transparent 68%),
    radial-gradient(34% 38% at 84% 22%, rgba(224,168,192,.42), transparent 68%),
    radial-gradient(34% 40% at 16% 64%, rgba(150,210,180,.4), transparent 68%);
  filter: blur(52px); will-change: transform;
  animation: gardenGlow 26s ease-in-out infinite alternate; }
@keyframes gardenGlow {
  from { transform: translate(-2%, 1%) scale(1) rotate(-3deg); }
  to   { transform: translate(3%, -2%) scale(1.12) rotate(4deg); }
}
@media (prefers-reduced-motion: reduce) { .garden-glow { animation: none; } }
.wrap, .room-nav { position: relative; z-index: 2; }

/* ===== живой фон: свет + пыльца (единый приём с комнатой ресурсов) ===== */
.ambient { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.ambient .orb { position: absolute; border-radius: 50%; filter: blur(34px); transform: translate(-50%, -50%);
  animation-name: orbFloat; animation-timing-function: ease-in-out; animation-iteration-count: infinite; will-change: transform; }
@keyframes orbFloat {
  0%, 100% { transform: translate(-50%, -50%); }
  50% { transform: translate(calc(-50% + var(--dx, 1) * 46px), calc(-50% + var(--dy, 1) * 46px)); }
}
.ambient .pollen { position: absolute; border-radius: 50%;
  animation-name: pollenRise; animation-timing-function: ease-in-out; animation-iteration-count: infinite; will-change: transform, opacity; }
@keyframes pollenRise {
  0% { transform: translate(0, 0); opacity: 0; }
  20% { opacity: .9; }
  80% { opacity: .9; }
  100% { transform: translate(12px, -48px); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .ambient .orb { animation: none; }
  .ambient .pollen { animation: none; opacity: .7; }
}

/* ===== сад ===== */
.garden { position: relative; overflow: hidden; background: linear-gradient(180deg, rgba(255,255,255,.55), rgba(236,246,228,.7));
  border: 1px solid rgba(120,160,110,.2); border-radius: 24px; box-shadow: 0 12px 34px rgba(110,150,90,.16);
  padding: 22px; margin-bottom: 24px; }
.garden-fx { position: absolute; inset: 0; pointer-events: none; overflow: hidden; z-index: 0; }
.garden .section-h2, .garden-grid { position: relative; z-index: 1; }
.firefly { position: absolute; width: 5px; height: 5px; border-radius: 50%; background: #fff6a8;
  box-shadow: 0 0 8px 2px rgba(255,238,150,.9); animation: fireflyFloat ease-in-out infinite; }
@keyframes fireflyFloat { 0%,100% { transform: translate(0,0); opacity: .25; } 50% { transform: translate(16px,-20px); opacity: 1; } }
.butterfly { position: absolute; font-size: 1.2rem; animation: flyAcross linear infinite; opacity: .85; }
@keyframes flyAcross {
  0% { left: -8%; transform: translateY(0) rotate(-5deg); }
  50% { transform: translateY(-20px) rotate(5deg); }
  100% { left: 110%; transform: translateY(0) rotate(-5deg); } }
.plant-card.tapped { animation: tapGlow .7s ease; }
@keyframes tapGlow { 0% { box-shadow: 0 6px 18px rgba(110,150,90,.12); }
  35% { transform: scale(1.05); box-shadow: 0 0 26px rgba(150,200,110,.6); } 100% { transform: scale(1); box-shadow: 0 6px 18px rgba(110,150,90,.12); } }
.garden-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 16px; }
.plant-card { position: relative; background: #fff; border: 1px solid rgba(120,160,110,.16); border-radius: 20px;
  padding: 12px 12px 14px; box-shadow: 0 6px 18px rgba(110,150,90,.12); display: flex; flex-direction: column; align-items: center; text-align: center; }
.plant-card.done { background: linear-gradient(180deg, #fff, #f3fbec); box-shadow: 0 0 0 2px #a7d98a, 0 8px 22px rgba(120,180,90,.25); }
.plant-svg { width: 110px; height: 142px; }
.plant-svg .grow { transition: all .8s cubic-bezier(.3,1,.4,1); }
.pc-name { font-family: 'Comfortaa', sans-serif; font-weight: 700; font-size: 1.02rem; color: #3f5a32; margin: 4px 0 2px; }
.pc-type { font-size: .76rem; font-weight: 700; padding: 2px 10px; border-radius: 999px; margin-bottom: 8px; }
.pc-type.flower { background: #fde9f1; color: #c2587e; }
.pc-type.tree { background: #e2f0d8; color: #4e8a44; }
.pc-prog { font-size: .82rem; color: #6a7d5a; margin-bottom: 4px; }
.pc-bar { width: 100%; height: 7px; border-radius: 999px; background: rgba(120,160,110,.18); overflow: hidden; margin-bottom: 10px; }
.pc-bar-fill { height: 100%; border-radius: 999px; background: linear-gradient(90deg, #a7d98a, #6fb878); transition: width .8s ease; }
.pc-actions { display: flex; flex-wrap: wrap; gap: 7px; justify-content: center; }
.pc-btn { border: none; cursor: pointer; font-family: inherit; font-weight: 800; font-size: .84rem; padding: 9px 14px; border-radius: 999px;
  color: #fff; background: linear-gradient(135deg, #7fc0e8, #6fb0e0); transition: transform .15s; }
.pc-btn.keep { background: linear-gradient(135deg, #8fcf9f, #6fb878); }
.pc-btn.rest { background: #eef2e8; color: #7a8a6a; }
.pc-btn:hover { transform: translateY(-2px); }
.pc-btn:disabled { opacity: .5; cursor: default; transform: none; }
.pc-done { font-weight: 800; color: #4e8a44; font-size: .9rem; }
.pc-reward { font-size: .82rem; color: #7a6a4a; margin-top: 4px; }
.pc-del { position: absolute; top: 8px; right: 10px; border: none; background: transparent; color: #b0bca6; cursor: pointer; font-size: 1.05rem; opacity: .6; }
.pc-del:hover { opacity: 1; }
.garden-empty { text-align: center; color: #7a8a6a; font-style: italic; padding: 26px; }

/* всплытие капельки/листочка */
.float-up { position: fixed; z-index: 80; font-size: 1.6rem; pointer-events: none; animation: floatUp 1.1s ease-out forwards; }
@keyframes floatUp { 0% { opacity: 0; transform: translateY(0) scale(.6); } 25% { opacity: 1; } 100% { opacity: 0; transform: translateY(-60px) scale(1.1); } }

/* ===== посадка семени (форма) ===== */
.seed-card { background: rgba(255,255,255,.78); backdrop-filter: blur(8px); border: 1px solid rgba(120,160,110,.2);
  border-radius: 24px; box-shadow: 0 12px 34px rgba(110,150,90,.16); padding: 26px; margin-bottom: 24px; }
.seed-card h2 { font-family: 'Comfortaa', sans-serif; font-size: 1.35rem; margin: 0 0 4px; color: #3f5a32; }
.seed-card .sub { color: #6a7d5a; margin: 0 0 18px; font-size: .95rem; }
.sfield { margin-bottom: 16px; }
.sfield .lbl { display: block; font-weight: 800; font-size: .9rem; color: #3f5a32; margin-bottom: 7px; }
.sfield input[type="text"], .sfield textarea { width: 100%; padding: 12px 14px; border: 1px solid rgba(120,160,110,.25); border-radius: 12px;
  font-family: inherit; font-size: 1rem; color: #3a4a30; background: rgba(255,255,255,.9); }
.sfield textarea { min-height: 60px; resize: vertical; }
.sfield input:focus, .sfield textarea:focus { outline: none; border-color: #7fbd82; box-shadow: 0 0 0 4px rgba(127,189,130,.16); }

.seg { display: flex; flex-wrap: wrap; gap: 8px; }
.seg label { cursor: pointer; }
.seg input { position: absolute; opacity: 0; }
.seg .opt { display: inline-block; padding: 9px 15px; border-radius: 999px; border: 2px solid rgba(120,160,110,.2);
  background: rgba(255,255,255,.6); font-weight: 700; font-size: .9rem; color: #4a5a3a; transition: all .15s; }
.seg label:hover .opt { background: #fff; }
.seg input:checked + .opt { border-color: #7fbd82; background: #fff; box-shadow: 0 4px 12px rgba(127,189,130,.2); color: #3f5a32; }
.seg .opt .ico { margin-right: 5px; }

.creed { background: linear-gradient(135deg, #f3fbec, #eaf6df); border: 1px dashed #bcd9a8; border-radius: 16px;
  padding: 16px 18px; margin: 18px 0; color: #4e6a42; font-size: .96rem; line-height: 1.6; }
.creed b { color: #3f5a32; }

.btn-plant { border: none; cursor: pointer; font-family: inherit; font-weight: 800; font-size: 1.05rem; padding: 15px 30px; border-radius: 999px;
  color: #fff; background: linear-gradient(135deg, #8fcf9f, #6fb878); box-shadow: 0 10px 26px rgba(120,180,90,.35); transition: transform .15s; }
.btn-plant:hover { transform: translateY(-2px); }

.section-h2 { font-family: 'Comfortaa', sans-serif; font-size: 1.4rem; margin: 8px 0 14px; color: #3f5a32; display: flex; align-items: center; gap: 9px; }
