/* 🌷 双人共同浇花 —— 从 island.css 抽出,改为无条件加载(默认皮肤也能玩)。
   .gd-* 规则本就不带 [data-theme] 前缀,任何皮肤都适用。配套 public/js/garden.js。 */

/* 浇花遮罩打开时藏掉顶部浮动头像卡(半透明遮罩下它的白渐变会在顶部形成亮带) */
body.garden-open .chat-profile-card { display: none; }

.gd-overlay {
  position: fixed; inset: 0; z-index: 9000;
  background: rgba(40, 30, 20, 0.5);
  display: flex; align-items: center; justify-content: center; padding: 18px;
}
.gd-panel {
  width: 340px; max-width: 94vw; max-height: 90vh; overflow: auto; position: relative;
  background: radial-gradient(circle, rgba(114,93,66,.05) 1px, transparent 1.5px) 0 0 / 14px 14px, rgb(247,243,223);
  border: 2px solid #d9c9a8; border-radius: 26px 22px 28px 24px / 22px 28px 24px 26px;
  box-shadow: 0 16px 44px rgba(61,52,40,.34);
  font-family: 'Nunito','PingFang SC',sans-serif; color: #6b5a40;
  padding: 16px 16px 20px;
}
.gd-close {
  position: absolute; top: 8px; right: 12px; z-index: 3; width: 30px; height: 30px;
  border: none; background: transparent; font-size: 24px; color: #b6a486; cursor: pointer; line-height: 1;
}
.gd-title { text-align: center; font-size: 19px; font-weight: 900; margin: 2px 0 8px; color: #5e7a3e; }
.gd-loading, .gd-empty { text-align: center; padding: 40px 10px; color: #9a8c70; font-weight: 700; line-height: 1.7; }

/* —— 场景:天空 + 花 + 水壶 —— */
.gd-scene {
  position: relative; height: 270px; border-radius: 20px; overflow: hidden;
  background: linear-gradient(180deg, #cdeeff 0%, #e3f6ef 52%, #f3f4dd 100%);
  box-shadow: inset 0 -16px 26px rgba(150,190,150,.18);
}
.gd-scene::before { /* 太阳 */
  content: ""; position: absolute; top: 16px; right: 22px; width: 52px; height: 52px; border-radius: 50%;
  background: radial-gradient(circle at 40% 38%, #fff3c4 0%, #ffe08f 60%, rgba(255,224,143,0) 72%);
}

/* —— 花本体(200x250 容器,底部花盆) —— */
.gd-plant { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 200px; height: 256px; }
.gd-plant.grew { animation: gdGrew .55s cubic-bezier(.34,1.56,.64,1); }
@keyframes gdGrew { 0%{transform:translateX(-50%) scale(.86)} 60%{transform:translateX(-50%) scale(1.06)} 100%{transform:translateX(-50%) scale(1)} }

/* 花盆 */
.gd-pot { position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%); width: 104px; height: 70px;
  background: linear-gradient(#eaa97d, #d98a5c); clip-path: polygon(9% 0, 91% 0, 80% 100%, 20% 100%); border-radius: 0 0 12px 12px; }
.gd-pot::before { content: ""; position: absolute; top: -12px; left: -6px; width: 116px; height: 22px;
  background: linear-gradient(#f3b889, #e79a68); border-radius: 12px; box-shadow: 0 3px 0 rgba(150,90,55,.25); }
.gd-soil { position: absolute; top: -8px; left: 50%; transform: translateX(-50%); width: 92px; height: 18px; border-radius: 50%;
  background: radial-gradient(circle at 50% 35%, #8a6244, #6e4a30); z-index: 2; }
.gd-seed { position: absolute; top: -14px; left: 50%; transform: translateX(-50%); width: 12px; height: 14px; border-radius: 50% 50% 50% 50%/60% 60% 40% 40%;
  background: linear-gradient(#b98a5e, #8a5f3a); z-index: 3; display: none; }

/* 茎 / 叶 / 嫩芽 */
.gd-stem { position: absolute; left: 50%; bottom: 70px; transform: translateX(-50%); width: 11px; height: 104px;
  background: linear-gradient(90deg, #7cc063, #9ad77f 50%, #6fb455); border-radius: 6px; transform-origin: bottom center; display: none; }
.gd-leaf { position: absolute; bottom: 104px; width: 44px; height: 26px; background: linear-gradient(160deg, #a6e08a, #7ec565);
  border-radius: 0 100% 0 100%; display: none; box-shadow: inset -2px -2px 0 rgba(90,150,70,.18); }
.gd-leaf.l { left: 46px; transform: rotate(18deg); }
.gd-leaf.r { right: 46px; transform: rotate(-18deg) scaleX(-1); }
.gd-sprout { position: absolute; left: 50%; bottom: 76px; transform: translateX(-50%); width: 40px; height: 30px; display: none; }
.gd-sprout span { position: absolute; bottom: 0; width: 20px; height: 24px; background: linear-gradient(160deg, #aee48f, #7ec565); border-radius: 0 100% 0 100%; }
.gd-sprout span:first-child { left: 0; transform: rotate(20deg); }
.gd-sprout span:last-child { right: 0; transform: rotate(-20deg) scaleX(-1); }

/* 花苞 */
.gd-bud { position: absolute; left: 50%; bottom: 158px; transform: translateX(-50%); width: 30px; height: 40px; display: none; z-index: 4;
  background: radial-gradient(circle at 50% 30%, var(--petal), var(--petal2)); border-radius: 50% 50% 50% 50%/65% 65% 35% 35%;
  box-shadow: inset 0 -4px 6px rgba(0,0,0,.08); }
.gd-bud::after { content: ""; position: absolute; bottom: -6px; left: 50%; transform: translateX(-50%); width: 20px; height: 14px;
  background: #7ec565; border-radius: 0 0 50% 50%; }

/* 开花:6 瓣 + 花心 */
.gd-bloom { position: absolute; left: 50%; bottom: 132px; transform: translateX(-50%); width: 92px; height: 92px; display: none; z-index: 5;
  animation: gdSway 4s ease-in-out infinite; transform-origin: 50% 100%; }
/* 放射状花瓣:位置由内联 transform(已含 translate(-50%,-50%))控制;形状按 p-* 变体 */
.gd-bloom .petal { position: absolute; left: 50%; top: 50%; width: 30px; height: 42px;
  background: radial-gradient(circle at 50% 34%, var(--petal), var(--petal2));
  border-radius: 50% 50% 50% 50%/62% 62% 38% 38%; box-shadow: inset 0 -3px 5px rgba(0,0,0,.06); }
.gd-bloom .gd-center { position: absolute; left: 50%; top: 50%; width: var(--csz,34px); height: var(--csz,34px);
  transform: translate(-50%,-50%); border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, var(--center), color-mix(in srgb, var(--center) 72%, #000 16%));
  box-shadow: inset 0 -3px 5px rgba(0,0,0,.16); z-index: 3; }
/* 雏菊:细长白瓣 */
.shape-radial.p-thin .petal { width: 13px; height: 40px; border-radius: 50%; }
/* 虞美人:4 片宽大圆瓣 + 深色花心 */
.shape-radial.p-poppy .petal { width: 40px; height: 42px; border-radius: 50% 50% 48% 48%/56% 56% 44% 44%; }
.shape-radial.p-poppy .gd-center { box-shadow: 0 0 0 5px color-mix(in srgb, var(--petal2) 80%, #000 20%) inset, inset 0 -2px 4px rgba(0,0,0,.4); }
/* 向日葵:多片尖射瓣 */
.shape-radial.p-sun .petal { width: 15px; height: 40px; border-radius: 50% 50% 38% 38%; }
/* 樱花:5 片带缺口的瓣 */
.shape-radial.p-sakura .petal { width: 31px; height: 36px;
  clip-path: polygon(0% 42%, 24% 4%, 50% 20%, 76% 4%, 100% 42%, 80% 100%, 20% 100%); }
/* 百合:6 片尖瓣(星形) */
.shape-radial.p-lily .petal { width: 18px; height: 48px;
  clip-path: polygon(50% 0%, 100% 34%, 78% 100%, 22% 100%, 0% 34%); }
.shape-radial.p-lily .gd-center { box-shadow: 0 0 0 3px color-mix(in srgb, var(--center) 60%, #fff 30%) inset, inset 0 -3px 5px rgba(0,0,0,.16); }

/* —— 郁金香:杯状 3 瓣 —— */
.gd-bloom.shape-tulip { height: 78px; }
.shape-tulip .tp { position: absolute; bottom: 4px; background: radial-gradient(circle at 50% 28%, var(--petal), var(--petal2)); box-shadow: inset 0 -3px 6px rgba(0,0,0,.08); }
.shape-tulip .tm { left: 50%; transform: translateX(-50%); width: 40px; height: 60px; border-radius: 48% 48% 46% 46%/72% 72% 30% 30%; z-index: 2; }
.shape-tulip .tl { left: 16px; width: 30px; height: 54px; border-radius: 70% 30% 46% 46%/76% 76% 30% 30%; transform: rotate(-7deg); }
.shape-tulip .tr { right: 16px; width: 30px; height: 54px; border-radius: 30% 70% 46% 46%/76% 76% 30% 30%; transform: rotate(7deg); }

/* —— 玫瑰:同心层叠 —— */
.shape-rose .rl { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); border-radius: 50%; box-shadow: inset 0 -3px 6px rgba(0,0,0,.12); }
.shape-rose .r1 { width: 78px; height: 78px; background: radial-gradient(circle at 42% 36%, var(--petal), var(--petal2)); }
.shape-rose .r2 { width: 58px; height: 58px; background: radial-gradient(circle at 42% 36%, color-mix(in srgb, var(--petal) 70%, var(--petal2)), var(--petal2)); }
.shape-rose .r3 { width: 38px; height: 38px; background: radial-gradient(circle at 42% 36%, var(--petal), var(--center)); }
.shape-rose .r4 { width: 18px; height: 18px; background: var(--center); }

/* —— 风信子:三角花串 —— */
.gd-bloom.shape-cluster { width: 88px; height: 92px; }
.shape-cluster .fl { position: absolute; width: 19px; height: 19px; border-radius: 50%;
  background: radial-gradient(circle at 40% 34%, var(--petal), var(--petal2)); box-shadow: inset 0 -2px 3px rgba(0,0,0,.12); }

/* —— 风铃草:垂吊铃铛 —— */
.gd-bloom.shape-bell { width: 90px; height: 70px; }
.shape-bell .bell { position: absolute; width: 26px; height: 30px;
  background: linear-gradient(180deg, var(--petal), var(--petal2)); border-radius: 44% 44% 50% 50%/26% 26% 74% 74%;
  box-shadow: inset 0 -3px 5px rgba(0,0,0,.12); }
.shape-bell .bell::after { content: ""; position: absolute; bottom: -4px; left: 50%; transform: translateX(-50%);
  width: 16px; height: 9px; background: var(--petal2); border-radius: 0 0 60% 60%; }
.shape-bell .b1 { left: 8px; top: 18px; transform: rotate(-13deg); }
.shape-bell .b2 { left: 32px; top: 6px; }
.shape-bell .b3 { left: 54px; top: 20px; transform: rotate(13deg); }

@keyframes gdSway { 0%,100%{transform:translateX(-50%) rotate(-4deg)} 50%{transform:translateX(-50%) rotate(4deg)} }

/* 各阶段显隐 */
.gd-plant.stage-seed .gd-seed { display: block; }
.gd-plant.stage-sprout .gd-sprout { display: block; }
.gd-plant.stage-leaf .gd-stem,
.gd-plant.stage-bud .gd-stem,
.gd-plant.stage-bloom .gd-stem,
.gd-plant.stage-dead .gd-stem { display: block; }
.gd-plant.stage-leaf .gd-leaf,
.gd-plant.stage-bud .gd-leaf,
.gd-plant.stage-bloom .gd-leaf,
.gd-plant.stage-dead .gd-leaf { display: block; }
.gd-plant.stage-bud .gd-bud { display: block; }
.gd-plant.stage-bloom .gd-bloom { display: block; }
/* 枯死:发褐、垂头 */
.gd-plant.stage-dead .gd-stem { background: linear-gradient(90deg,#9a8a6a,#b3a384 50%,#8c7c5c); transform: translateX(-50%) rotate(8deg); }
.gd-plant.stage-dead .gd-leaf { background: linear-gradient(160deg,#c2b58f,#a59873); transform: rotate(40deg); filter: grayscale(.3); }
.gd-plant.stage-dead .gd-leaf.r { transform: rotate(-50deg) scaleX(-1); }

/* —— 浇水壶(浇水时滑入倾倒) —— */
.gd-can { position: absolute; top: 18px; left: 50%; transform: translate(40px,-120px) rotate(0deg); opacity: 0; z-index: 6; width: 60px; height: 46px; pointer-events: none; }
.gd-can-body { position: absolute; right: 0; top: 6px; width: 44px; height: 36px; background: linear-gradient(#8fd2e6,#5cb6d6); border-radius: 10px 12px 12px 14px; box-shadow: inset -3px -3px 0 rgba(40,110,130,.2); }
.gd-can-body::after { content: ""; position: absolute; top: -10px; right: 8px; width: 22px; height: 12px; border: 4px solid #5cb6d6; border-bottom: none; border-radius: 14px 14px 0 0; background: transparent; }
.gd-can-spout { position: absolute; left: 0; top: 12px; width: 26px; height: 9px; background: #6cc0dd; border-radius: 6px; transform: rotate(-12deg); }
.gd-drop { position: absolute; left: 6px; top: 24px; width: 6px; height: 9px; border-radius: 50% 50% 50% 50%/60% 60% 40% 40%; background: #6cc0dd; opacity: 0; }
.gd-scene.watering .gd-can { animation: gdCanIn 1.4s ease-in-out; }
.gd-scene.watering .gd-drop.d1 { animation: gdDrop .5s linear .45s 2; }
.gd-scene.watering .gd-drop.d2 { animation: gdDrop .5s linear .6s 2; }
.gd-scene.watering .gd-drop.d3 { animation: gdDrop .5s linear .75s 2; }
@keyframes gdCanIn {
  0% { opacity: 0; transform: translate(40px,-120px) rotate(0deg); }
  22% { opacity: 1; transform: translate(-30px,-6px) rotate(0deg); }
  40%,72% { opacity: 1; transform: translate(-30px,-6px) rotate(-26deg); }
  100% { opacity: 0; transform: translate(40px,-120px) rotate(0deg); }
}
@keyframes gdDrop { 0% { opacity: 0; transform: translateY(0); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(60px); } }

/* 开花花瓣迸发 */
.gd-petal-burst { position: absolute; top: 38%; width: 10px; height: 12px; border-radius: 50% 50% 50% 50%/60% 60% 40% 40%;
  background: var(--petal, #ff8fb0); pointer-events: none; animation: gdBurst 1.6s ease-out forwards; z-index: 7; }
@keyframes gdBurst { 0%{opacity:1;transform:translate(0,0) rotate(0)} 100%{opacity:0;transform:translate(var(--dx,0),120px) rotate(300deg)} }

/* —— 状态 / 进度点 / 按钮 / meta —— */
.gd-status { text-align: center; font-size: 14px; font-weight: 800; margin: 12px 0 8px; color: #6b5a40; min-height: 20px; }
.gd-dots { display: flex; gap: 7px; justify-content: center; min-height: 14px; margin-bottom: 12px; }
.gd-dots span { width: 12px; height: 12px; border-radius: 50%; background: #cbbd99; box-shadow: inset 0 0 0 1px rgba(114,93,66,.2); }
.gd-dots span.on { background: linear-gradient(#9ad77f,#6fb455); }
.gd-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.gd-btn { border: none; border-radius: 14px; padding: 11px 20px; font: 800 15px 'Nunito','PingFang SC',sans-serif; cursor: pointer;
  color: #fff; transition: transform .08s, box-shadow .08s; }
.gd-btn.water { background: linear-gradient(#6cc0dd,#4ba6c9); box-shadow: 0 4px 0 #3d8eaf; }
.gd-btn.water.done { background: #c9d3c2; box-shadow: 0 4px 0 #aab6a2; color: #fff; cursor: default; }
.gd-btn.bloom { background: linear-gradient(#ffac4d,#ff8f3c); box-shadow: 0 4px 0 #e07628; }
.gd-btn.replant { background: linear-gradient(#9ad77f,#6fb455); box-shadow: 0 4px 0 #589a44; }
.gd-btn.ghost { background: rgb(247,243,223); color: #7a6a4c; border: 2px solid #d9c9a8; box-shadow: 0 4px 0 #cbb98f; }
.gd-btn:active { transform: translateY(2px); box-shadow: none; }
.gd-meta { text-align: center; font-size: 12px; color: #9a8c70; margin-top: 12px; font-weight: 700; }

/* —— 花房图鉴 —— */
.gd-house { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin: 8px 0 12px; }
.gd-card { box-sizing: border-box; min-width: 0; background: linear-gradient(180deg,#fbf7ea,#f1ead4); border: 2px solid #e2d5b6; border-radius: 16px; padding: 8px 3px; text-align: center; }
.gd-card-flower { position: relative; height: 100px; overflow: hidden; }
.gd-card-flower .gd-plant { transform: translateX(-50%) scale(.42); transform-origin: bottom center; bottom: 0; }
.gd-card-name { font-size: 12px; font-weight: 800; color: #6b5a40; margin-top: 2px; }
.gd-card-date { font-size: 10px; color: #a89a7c; }
/* 未解锁:灰色剪影 */
.gd-card.locked { background: linear-gradient(180deg,#f3f0e6,#e9e4d4); }
.gd-card.locked .gd-card-flower .gd-plant { filter: grayscale(1) brightness(1.06) opacity(.3); }
.gd-card.locked .gd-card-name { color: #b9ad93; }
.gd-card.locked .gd-card-date { color: #c6bba1; }
.gd-count { font-size: 12px; font-weight: 800; color: #6f8a4a; background: #eaf0d6; border-radius: 10px; padding: 1px 9px; vertical-align: middle; margin-left: 4px; }
.gd-empty { font-size: 12px; color: #9a8c70; text-align: center; margin: 2px 0 10px; line-height: 1.6; }

/* 每日一问❓ / 浇花🌷 浮动按钮:只在默认皮肤显示(动森皮肤走💗情侣空间面板里的对应卡,故隐藏避免重复)。
   默认皮肤下可见 FAB 只有 搜索/日历(top+64)——这俩排在 164 / 264,和动森才显示的 vocab/couple 永不同屏冲突。 */
.dailyq-fab { right: 16px; top: calc(env(safe-area-inset-top, 0px) + 164px); font-size: 20px; }
.garden-fab { right: 16px; top: calc(env(safe-area-inset-top, 0px) + 264px); font-size: 22px; }
html[data-theme="island"] .dailyq-fab, html[data-theme="island"] .garden-fab { display: none !important; }
/* 设置里的开关(Settings.coupleFabs=false → <html> 加 hide-couple-fabs)可整体关掉这俩按钮 */
html.hide-couple-fabs .dailyq-fab, html.hide-couple-fabs .garden-fab { display: none !important; }

/* 尊重「减弱动态效果」:关掉浇花的循环/装饰动画 */
@media (prefers-reduced-motion: reduce) {
  .gd-bloom, .gd-plant.grew, .gd-scene.watering .gd-can,
  .gd-scene.watering .gd-drop, .gd-petal-burst { animation: none !important; }
}
