/* ─── 花瓣（画布的谐音梗）─── 独立于 canvas，删除不影响任何现有样式 */
#panel-petal{background:#F4F2EF;position:relative}
#petal-root{position:absolute;inset:0;overflow:hidden;background:#F4F2EF;
  background-image:radial-gradient(circle at 20% 30%,rgba(179,148,96,.03) 0,transparent 40%),radial-gradient(circle at 80% 70%,rgba(15,34,64,.02) 0,transparent 45%);
  font-family:"LXGW WenKai Lite","PingFang SC",-apple-system,sans-serif;
  color:#0F2240;
  touch-action:none;
  overscroll-behavior:contain;
}

/* 画布 */
#petal-canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}

/* 贴纸层 */
#petal-stickers{position:absolute;inset:0;pointer-events:none}
.petal-sticker{position:absolute;pointer-events:auto;user-select:none;-webkit-user-drag:none;touch-action:none;
  transition:filter .15s ease,outline .15s ease;outline:2px dashed transparent;outline-offset:4px;
}
.petal-sticker img{width:100%;height:100%;pointer-events:none;-webkit-user-drag:none;filter:drop-shadow(1px 2px 3px rgba(15,34,64,.08))}
.petal-sticker.selected{outline-color:rgba(179,148,96,.75)}
.petal-sticker.selected::after{content:"";position:absolute;right:-14px;bottom:-14px;width:26px;height:26px;border-radius:50%;background:#B39460;box-shadow:0 2px 6px rgba(0,0,0,.15);cursor:nwse-resize;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 20L20 4'/%3E%3Cpath d='M20 14v6h-6'/%3E%3Cpath d='M4 10V4h6'/%3E%3C/svg%3E");background-size:60%;background-position:center;background-repeat:no-repeat}
.petal-sticker .sticker-del{position:absolute;left:-12px;top:-12px;width:24px;height:24px;border-radius:50%;background:#fff;color:#c94f4f;display:none;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.18);font-size:14px;line-height:1;font-weight:600}
.petal-sticker.selected .sticker-del{display:flex}

/* 文字层 */
.petal-text{position:absolute;pointer-events:auto;white-space:pre-wrap;line-height:1.2;padding:2px 4px;outline:1px dashed transparent;font-weight:500;touch-action:none}
.petal-text.en{font-family:"Caveat",cursive;font-weight:700}
.petal-text.selected{outline-color:rgba(179,148,96,.75)}
.petal-text .sticker-del{position:absolute;left:-10px;top:-10px;width:22px;height:22px;border-radius:50%;background:#fff;color:#c94f4f;display:none;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.18);font-size:13px;font-weight:600}
.petal-text.selected .sticker-del{display:flex}

/* 顶部 hint */
#petal-hint{position:absolute;top:10px;left:50%;transform:translateX(-50%);padding:6px 14px;background:rgba(244,242,239,.85);backdrop-filter:blur(10px);border:1px solid rgba(179,148,96,.18);border-radius:18px;font-size:11px;color:#B39460;letter-spacing:.08em;pointer-events:none;opacity:0;transition:opacity .3s}
#petal-hint.visible{opacity:1}

/* 工具栏 */
#petal-tools{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);display:flex;align-items:center;gap:6px;padding:8px 12px;background:rgba(255,255,255,.92);backdrop-filter:blur(14px) saturate(1.2);border:1px solid rgba(15,34,64,.08);border-radius:28px;box-shadow:0 10px 28px rgba(15,34,64,.1);z-index:10}
.petal-tool{width:36px;height:36px;border-radius:50%;border:none;background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#0F2240;transition:background .15s,color .15s;-webkit-tap-highlight-color:transparent;touch-action:manipulation;flex-shrink:0;padding:0}
.petal-tool svg{width:20px;height:20px}
.petal-tool.active{background:#0F2240;color:#F4F2EF}
.petal-tool:hover{background:rgba(15,34,64,.06)}
.petal-tool.active:hover{background:#0F2240}
.petal-tool-sep{width:1px;height:22px;background:rgba(15,34,64,.12);margin:0 2px;flex-shrink:0}

/* 子面板 - 颜色 */
#petal-subpanel{position:absolute;left:50%;bottom:80px;transform:translateX(-50%) translateY(8px);display:none;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 14px;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border:1px solid rgba(15,34,64,.08);border-radius:20px;box-shadow:0 10px 28px rgba(15,34,64,.12);max-width:82vw;z-index:9;opacity:0;transition:opacity .18s,transform .18s}
#petal-subpanel.visible{display:flex;opacity:1;transform:translateX(-50%) translateY(0)}
.petal-color{width:22px;height:22px;border-radius:50%;cursor:pointer;transition:transform .12s;border:2px solid rgba(15,34,64,.08)}
.petal-color:hover{transform:scale(1.15)}
.petal-color.active{transform:scale(1.2);box-shadow:0 0 0 2px #F4F2EF,0 0 0 4px #0F2240}
.petal-size{width:34px;height:34px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s}
.petal-size .dot{border-radius:50%;background:currentColor;color:#0F2240}
.petal-size.active{background:rgba(15,34,64,.08)}

/* 召唤对话框 */
#petal-summon{position:absolute;inset:0;background:rgba(15,34,64,.35);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;z-index:20}
#petal-summon.visible{display:flex}
.summon-card{width:min(88vw,380px);background:#F4F2EF;border-radius:18px;padding:20px;box-shadow:0 20px 60px rgba(15,34,64,.3);border:1px solid rgba(179,148,96,.2)}
.summon-title{font-family:"Playfair Display",serif;font-style:italic;font-size:24px;color:#0F2240;margin-bottom:4px;letter-spacing:.02em}
.summon-sub{font-size:12px;color:#B39460;margin-bottom:14px;letter-spacing:.08em}
.summon-input{width:100%;padding:11px 14px;background:#fff;border:1px solid rgba(15,34,64,.12);border-radius:12px;font-size:14px;font-family:inherit;color:#0F2240;outline:none;transition:border-color .15s}
.summon-input:focus{border-color:#B39460}
.summon-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;margin-bottom:16px}
.summon-chip{padding:5px 10px;background:rgba(179,148,96,.12);color:#B39460;border:1px solid rgba(179,148,96,.25);border-radius:14px;font-size:12px;cursor:pointer;transition:background .12s}
.summon-chip:hover{background:rgba(179,148,96,.22)}
.summon-actions{display:flex;gap:8px;justify-content:flex-end}
.summon-btn{padding:9px 18px;border-radius:10px;font-size:13px;border:none;cursor:pointer;font-family:inherit;letter-spacing:.04em;transition:opacity .15s}
.summon-btn.primary{background:#0F2240;color:#F4F2EF}
.summon-btn.ghost{background:transparent;color:#0F2240}
.summon-btn:disabled{opacity:.5;cursor:wait}
.summon-loading{display:none;align-items:center;gap:10px;color:#0F2240;font-size:13px;padding:10px 0}
.summon-loading.visible{display:flex}
.summon-loading .spin{width:16px;height:16px;border:2px solid rgba(15,34,64,.2);border-top-color:#0F2240;border-radius:50%;animation:petal-spin .8s linear infinite}
@keyframes petal-spin{to{transform:rotate(360deg)}}

/* 文字输入浮层 */
#petal-text-input{position:absolute;display:none;background:transparent;color:inherit;outline:none;border:1.5px dashed #B39460;padding:4px 8px;min-width:100px;font-family:inherit;z-index:15;border-radius:4px;resize:none;overflow:hidden;-webkit-user-select:text;user-select:text}
.summon-input{-webkit-user-select:text;user-select:text}
#petal-text-input.visible{display:block}

/* 喷洒模式下的光标提示 */
#petal-root.spray-mode #petal-canvas{cursor:none}
#petal-spray-cursor{position:absolute;pointer-events:none;display:none;width:70px;height:70px;border:1.5px dashed rgba(179,148,96,.6);border-radius:50%;margin-left:-35px;margin-top:-35px;z-index:11}
#petal-root.spray-mode #petal-spray-cursor{display:block}

/* 清空确认 */
.petal-confirm{padding:10px 16px;background:rgba(15,34,64,.95);color:#F4F2EF;border-radius:14px;font-size:13px;position:absolute;bottom:76px;left:50%;transform:translateX(-50%);display:none;align-items:center;gap:12px;z-index:12}
.petal-confirm.visible{display:flex}
.petal-confirm button{background:transparent;border:1px solid #F4F2EF;color:#F4F2EF;padding:4px 12px;border-radius:10px;font-size:12px;cursor:pointer;font-family:inherit}
.petal-confirm button.danger{background:#c94f4f;border-color:#c94f4f}
