/* ============================================================
   灵灵星球 · 样式
   设计原则：iPad 优先、大字大按钮、暖色、不用文字堆砌
   ============================================================ */
:root{
  --pink:#FF7BAC; --pink-l:#FFE3EF;
  --purple:#9B6BFF; --purple-l:#EFE7FF;
  --yellow:#FFC94D; --yellow-l:#FFF4D6;
  --green:#4BD37B; --green-l:#DFF7E7;
  --blue:#5BB8FF;  --blue-l:#E3F2FF;
  --ink:#3B3355; --ink-soft:#7A7191;
  --paper:#FFFBF5;
  --r:24px;
  --shadow:0 6px 20px rgba(120,90,160,.14);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
body{
  font-family:"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei",system-ui,sans-serif;
  background:var(--paper); color:var(--ink);
  font-size:20px; line-height:1.7;
  overflow-x:hidden;
  user-select:none;
}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
img{max-width:100%;display:block}

/* ---------------- 舞台 ---------------- */
.stage{
  min-height:100vh; min-height:100dvh;
  display:flex; flex-direction:column;
  padding:16px 20px 32px;
  max-width:900px; margin:0 auto;
  position:relative;
}
.prog{
  height:10px;background:#EFE9F6;border-radius:99px;overflow:hidden;flex:none;margin-bottom:18px;
}
.prog span{
  display:block;height:100%;width:0;border-radius:99px;
  background:linear-gradient(90deg,var(--pink),var(--purple));
  transition:width .5s cubic-bezier(.4,0,.2,1);
}

/* ---------------- 灵灵角色（SVG + 口型） ---------------- */
.ling-box{
  display:flex; align-items:center; gap:18px;
  flex:none; margin-bottom:24px; min-height:150px;
}
.ling-host{position:relative;flex:none;width:142px;height:142px}
.ling-char{
  position:relative;
  filter:drop-shadow(0 8px 16px rgba(120,90,160,.22));
  animation:float 3.2s ease-in-out infinite;
}
.ling-svg{width:100%;height:100%;overflow:visible}
.ling-body{transform-origin:100px 120px;transition:transform .08s linear}
/* 全身版：躯干中心更靠下，情绪缩放的支点要跟着改 */
.ling-full .ling-body{transform-origin:100px 170px}
.ling-char.full{animation:float 3.6s ease-in-out infinite}
/* 挥手：只摆手臂，身体和头不动。
   注意别给 .armG 加 transform-box:fill-box —— 会让 SVG 里
   rotate(角度 cx cy) 的参考系失效，手臂直接飞到画面外。 */
.armL.waving{animation:lingWave 1.1s ease-in-out infinite;transform-origin:52px 196px}
@keyframes lingWave{0%,100%{transform:rotate(0deg)}50%{transform:rotate(-14deg)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.ling-deco{
  position:absolute;top:-2px;right:-10px;width:26px;height:26px;
  animation:twinkle 1.8s ease-in-out infinite;pointer-events:none;
  filter:drop-shadow(0 2px 5px rgba(255,255,255,.95));
}
@keyframes twinkle{0%,100%{transform:scale(1) rotate(0);opacity:.9}
                   50%{transform:scale(1.25) rotate(14deg);opacity:1}}
.eyeG{transition:transform .12s ease}

/* 情绪：整体姿态微调 */
.ling-char[data-emo="worry"]{animation:worryShake .55s ease-in-out infinite}
@keyframes worryShake{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
.ling-char[data-emo="wow"] .ling-svg{animation:wowPop .5s}
@keyframes wowPop{0%{transform:scale(1)}45%{transform:scale(1.12)}100%{transform:scale(1)}}
.ling-char[data-emo="sad"]{transform:translateY(4px)}
.ling-char[data-emo="sad"] .blush{opacity:.3}
.ling-char[data-emo="think"] .ling-svg{transform:rotate(-5deg)}

/* 说话时的呼吸光晕，--talk 由 JS 实时写入 */
.ling-host::after{
  content:'';position:absolute;inset:-8%;border-radius:50%;
  background:radial-gradient(circle,rgba(255,123,172,.28),transparent 68%);
  opacity:calc(var(--talk,0) * .85);
  transition:opacity .1s;pointer-events:none;z-index:-1;
}

/* 正在被朗读的选项：高亮，帮她把声音和文字对起来 */
.opt.reading{
  border-color:var(--yellow);background:var(--yellow-l);
  animation:readPulse 1s ease-in-out infinite;
}
@keyframes readPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.02)}}

.bubble{
  position:relative;flex:1;
  background:#fff;border-radius:var(--r);
  padding:18px 22px; box-shadow:var(--shadow);
  font-size:24px;line-height:1.65;font-weight:500;
  min-height:60px;
  animation:bubbleIn .3s ease-out;
}
@keyframes bubbleIn{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
.bubble::before{
  content:'';position:absolute;left:-9px;top:26px;
  border:10px solid transparent;border-right-color:#fff;border-left:0;
}

/* 通用弹跳 */
@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.25)}100%{transform:scale(1)}}

/* ---------------- 互动区 ---------------- */
/* 互动区：给个最小高度，避免 say 场景下半屏空荡 */
.act-box{
  flex:1;display:flex;flex-direction:column;
  justify-content:center;align-items:stretch;gap:16px;
  min-height:260px;
}

/* 按钮 */
.btn{
  background:linear-gradient(180deg,var(--purple),#8354F5);color:#fff;
  border-radius:99px;padding:16px 34px;font-size:21px;font-weight:700;
  box-shadow:0 5px 0 #6E3FD8, var(--shadow);
  transition:transform .08s, box-shadow .08s;
  align-self:center;
}
.btn:active{transform:translateY(4px);box-shadow:0 1px 0 #6E3FD8}
.btn.big{padding:19px 46px;font-size:24px}
.btn.small{padding:11px 22px;font-size:18px;box-shadow:0 3px 0 #6E3FD8}
.btn.green{background:linear-gradient(180deg,var(--green),#33BC64);box-shadow:0 5px 0 #27A354,var(--shadow)}

/* 选项 */
.opts{display:flex;flex-direction:column;gap:14px}
.opt{
  display:flex;align-items:center;gap:16px;
  background:#fff;border:3px solid #EEE7FA;border-radius:var(--r);
  padding:18px 22px;font-size:22px;font-weight:600;text-align:left;
  box-shadow:var(--shadow);transition:.15s;
}
.opt:active{transform:scale(.98)}
.opt .oe{width:42px;height:42px;flex:none;display:flex;align-items:center;justify-content:center;font-size:34px}
.opt .oe img,.opt .oe svg{width:100%;height:100%;object-fit:contain;display:block}
.opt.ok{border-color:var(--green);background:var(--green-l);animation:pop .4s}
.opt.no{border-color:#FFB3B3;background:#FFECEC;animation:shake .4s}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}

/* 点一点 */
.tap-field{position:relative;height:300px;background:var(--yellow-l);border-radius:var(--r);overflow:hidden}
.tap-item{
  position:absolute;font-size:56px;line-height:1;
  width:64px;height:64px;display:flex;align-items:center;justify-content:center;
  animation:bob 2s ease-in-out infinite;
  filter:drop-shadow(0 4px 6px rgba(0,0,0,.15));
}
.tap-item img,.tap-item svg{width:100%;height:100%;object-fit:contain;display:block}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-14px) rotate(6deg)}}
.tap-item.got{animation:fly .5s forwards}
@keyframes fly{to{transform:scale(1.8) translateY(-60px);opacity:0}}

/* 开口说话 */
.speak-box{display:flex;flex-direction:column;align-items:center;gap:14px}
.speak-tip{font-size:19px;color:var(--ink-soft)}
.chips{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.chip{
  background:#fff;border:3px solid var(--pink-l);border-radius:99px;
  padding:14px 26px;font-size:21px;font-weight:600;box-shadow:var(--shadow);
  transition:.12s;
}
.chip:active{transform:scale(.95);background:var(--pink-l)}
.chip.big{font-size:24px;padding:18px 34px}
.chip.drag{cursor:grab;touch-action:none}
.chip.dragging{opacity:.85;z-index:99;position:relative}
.chip.shake{animation:shake .4s}

.mic-btn{
  display:flex;align-items:center;gap:12px;
  background:linear-gradient(180deg,var(--pink),#F2568D);color:#fff;
  border-radius:99px;padding:20px 44px;font-size:23px;font-weight:700;
  box-shadow:0 6px 0 #D8407A, var(--shadow);
}
.mic-btn:active{transform:translateY(4px);box-shadow:0 2px 0 #D8407A}
.mic-btn .mic-i{font-size:32px}
.mic-btn.on{animation:pulse 1.1s infinite}
@keyframes pulse{0%,100%{box-shadow:0 6px 0 #D8407A,0 0 0 0 rgba(255,123,172,.55)}
                 50%{box-shadow:0 6px 0 #D8407A,0 0 0 22px rgba(255,123,172,0)}}
.mic-state{font-size:19px;color:var(--pink);min-height:26px;font-weight:600}
.mic-mini{background:var(--pink-l);border-radius:99px;padding:10px 22px;font-size:18px;font-weight:600;color:var(--ink)}

.type-row{display:flex;gap:10px;align-items:center;width:100%;max-width:520px}
.type-in{
  flex:1;border:3px solid #EEE7FA;border-radius:99px;
  padding:14px 22px;font-size:20px;font-family:inherit;outline:none;background:#fff;
}
.type-in:focus{border-color:var(--purple)}
.skip-btn{color:var(--ink-soft);font-size:18px;text-decoration:underline;padding:8px}

/* 画画 */
.slot-box{display:flex;flex-direction:column;align-items:center;gap:16px}
.slot-label{font-size:24px;font-weight:700;color:var(--purple)}
.draw-load{display:flex;flex-direction:column;align-items:center;gap:14px;padding:20px}
.easel{width:80px;height:80px;animation:paint 1.1s ease-in-out infinite}
@keyframes paint{0%,100%{transform:rotate(-12deg) scale(1)}50%{transform:rotate(12deg) scale(1.12)}}
.draw-tip{font-size:22px;font-weight:600}
.draw-sec{font-size:18px;color:var(--ink-soft)}
.draw-bar{width:80%;max-width:420px;height:14px;background:#EFE9F6;border-radius:99px;overflow:hidden}
.draw-bar span{display:block;height:100%;width:0;border-radius:99px;
  background:linear-gradient(90deg,var(--yellow),var(--pink));transition:width 1.4s linear}
.draw-result{border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);animation:pop .5s}
.draw-result img{width:100%;border-radius:var(--r)}

/* 拖拽 */
.drag-box{display:flex;flex-direction:column;gap:18px}
.drag-pool{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;min-height:70px}
.bins{display:flex;gap:14px}
.bin{flex:1;background:#fff;border:4px dashed #E6DEF6;border-radius:var(--r);padding:14px;min-height:150px;transition:.15s}
.bin.over{border-color:var(--purple);background:var(--purple-l)}
.bin h3{margin:0 0 10px;font-size:19px;text-align:center}
.bin .slot{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}

/* 奖励卡 */
.reward-card{
  align-self:center;width:260px;padding:30px 22px;text-align:center;
  background:linear-gradient(160deg,#fff,var(--yellow-l));
  border-radius:var(--r);box-shadow:0 12px 34px rgba(255,160,60,.32);
  border:4px solid var(--yellow);
  opacity:0;transform:scale(.5) rotate(-12deg);transition:.6s cubic-bezier(.34,1.56,.64,1);
}
.reward-card.in{opacity:1;transform:none}
.rc-emo{font-size:80px;line-height:1}
.rc-name{font-size:26px;font-weight:800;margin-top:10px}
.rc-desc{font-size:18px;color:var(--ink-soft);margin-top:6px}

/* 撒花 */
.spark{
  position:fixed;font-size:24px;pointer-events:none;z-index:999;
  animation:spark 1s ease-out forwards;
}
@keyframes spark{
  0%{transform:translate(0,0) scale(.4);opacity:1}
  100%{transform:translate(var(--dx),var(--dy)) scale(1.3);opacity:0}
}

/* ---------------- 首页 ---------------- */
.home{max-width:900px;margin:0 auto;padding:24px 20px 60px}
.home-hd{display:flex;align-items:center;gap:16px;margin-bottom:8px}
.home-hd .panda{width:72px;height:72px}
.home-hd .panda-face{font-size:44px}
.home-t{font-size:30px;font-weight:800}
.home-s{font-size:18px;color:var(--ink-soft)}
.stats{display:flex;gap:12px;margin:20px 0 26px}
.stat{flex:1;background:#fff;border-radius:20px;padding:16px;text-align:center;box-shadow:var(--shadow)}
.stat b{display:block;font-size:32px;color:var(--purple);line-height:1.2}
.stat span{font-size:16px;color:var(--ink-soft)}
.sec-t{font-size:22px;font-weight:800;margin:26px 0 14px;display:flex;align-items:center;gap:9px}
.sec-i{width:26px;height:26px;flex:none}

/* 小游戏入口 */
.glist{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.gitem{display:block;border-radius:20px;padding:16px 15px;text-decoration:none;
  background:#fff;box-shadow:0 3px 12px #0000000f;border:2px solid transparent;
  transition:transform .18s,box-shadow .18s}
.gitem:active{transform:scale(.97)}
.g-bk{border-color:#d0ebff;background:linear-gradient(160deg,#fff,#f1f8ff)}
.g-dw{border-color:#ffd7e4;background:linear-gradient(160deg,#fff,#fff5f8)}
.g-mm{border-color:#e5dbff;background:linear-gradient(160deg,#fff,#f8f5ff)}
.gi-art{width:52px;height:52px;margin-bottom:9px}
.gi-art svg{width:100%;height:100%}
.gi-t{font-size:17px;font-weight:800;color:var(--ink)}
.gi-s{font-size:12.5px;color:var(--ink-soft);margin-top:3px;line-height:1.4}
.clist{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.citem{
  background:#fff;border-radius:var(--r);padding:20px;box-shadow:var(--shadow);
  display:flex;gap:14px;align-items:center;transition:.15s;text-decoration:none;color:inherit;
  border:3px solid transparent;
}
.citem:active{transform:scale(.97)}
.citem.done{border-color:var(--green);background:var(--green-l)}
.ci-emo{width:56px;height:56px;flex:none;font-size:44px;display:flex;align-items:center;justify-content:center}
.ci-emo img{width:100%;height:100%;object-fit:contain}
.ci-t{font-size:19px;font-weight:700;line-height:1.35}
.ci-s{font-size:14px;color:var(--ink-soft);line-height:1.45;margin-top:3px}
.ci-done{margin-left:auto;width:26px;height:26px;flex:none}
.ci-done svg{width:100%;height:100%}
.cards-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:14px}
.wcard{background:#fff;border-radius:18px;padding:16px 10px;text-align:center;box-shadow:var(--shadow)}
.wcard.lock{opacity:.35;filter:grayscale(1)}
.wcard .we{width:44px;height:44px;margin:0 auto}
.wcard .we svg{width:100%;height:100%}
.wcard .wn{font-size:15px;font-weight:600;margin-top:4px}

/* ============================================================
   ★ 动画片（story 场景）—— 先看懂，再动手
   ============================================================ */
.film{
  position:relative;display:flex;flex-direction:column;gap:14px;
  align-items:stretch;justify-content:center;flex:1;
  min-height:calc(100vh - 150px);
  animation:filmIn .45s ease-out;
}
@keyframes filmIn{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
.film-stage{
  position:relative;width:100%;aspect-ratio:16/10;
  max-height:64vh;
  border-radius:22px;overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  transition:background .6s ease;
  background-size:cover;background-position:center;
}

/* 插画道具：预生成的透明底 PNG，比 emoji 精致得多 */
.fi.art{
  font-size:0;line-height:0;
  filter:drop-shadow(0 6px 10px rgba(0,0,0,.16));
}
.fi.art img{
  width:100%;height:auto;display:block;
  pointer-events:none;user-select:none;
}
.fi.flip img{transform:scaleX(-1)}

/* ★ 分镜里的灵灵：用全站同一份 SVG 渲染，不是生成的插画。
   以前用 AI 出图，每张脸都不一样，跟角落里的灵灵完全对不上。 */
.fi.ling-item{
  font-size:0;line-height:0;
  filter:drop-shadow(0 7px 12px rgba(120,90,160,.26));
}
.fi.ling-item .ling-char{animation:none}      /* 分镜自己有入场动画，别叠加漂浮 */
.fi.ling-item .ling-svg{width:100%;height:100%;display:block}

/* 内置矢量小符号：跟插画同一套画风，比彩色 emoji 协调
   （实测 ✅ 的绿方块会盖住插画主体，非常出戏） */
.fi.sym{font-size:0;line-height:0}
.fi.sym svg{width:100%;height:auto;display:block;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.18))}

/* 道具标签：放在主体正下方，描边保证任何背景上都清楚 */
.fi[data-label]::after{
  content:attr(data-label);
  position:absolute;left:50%;top:calc(100% + 14px);
  transform:translateX(-50%);
  font-size:40px;font-weight:900;letter-spacing:3px;
  color:#fff;-webkit-text-stroke:7px rgba(90,60,130,.9);
  paint-order:stroke fill;
  white-space:nowrap;
}
/* 背景：用渐变画"场景"，不依赖图片素材 */
.bg-sky{background:linear-gradient(#bfe6ff,#eaf7ff 60%,#d6f5e0)}
.bg-room{background:linear-gradient(#ffe9d6,#fff6ea 55%,#f3ddc7)}
.bg-street{background:linear-gradient(#cfe9ff,#eef6ff 50%,#dfe3e8 50%,#cfd4da)}
.bg-lab{background:linear-gradient(#e8e2ff,#f5f1ff 60%,#e0e8ff)}
.bg-dark{background:linear-gradient(#2b3350,#1a2036)}
.bg-warm{background:linear-gradient(#ffd9e6,#fff0f5 60%,#ffe6cf)}
.bg-old{background:linear-gradient(#e8ddc8,#f5efe0 60%,#ded2b8)}
.bg-night{background:linear-gradient(#1f2747,#3a3f6b 70%,#575c8c)}

/* 地面：给画面一个“站立感”，不再是图标漂在真空里 */
.film-stage::after{
  content:'';position:absolute;left:0;right:0;bottom:0;height:24%;
  background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.07));
  pointer-events:none;
}
.bg-dark::after,.bg-night::after{background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.28))}

/* 画面里的道具/角色 */
.fi{
  position:absolute;transform:translate(-50%,-50%);
  line-height:1;filter:drop-shadow(0 6px 10px rgba(0,0,0,.18));
  animation-duration:.6s;animation-fill-mode:both;animation-timing-function:cubic-bezier(.34,1.56,.64,1);
  z-index:1;
}
.in-pop{animation-name:fiPop}
.in-slide{animation-name:fiSlide}
.in-fade{animation-name:fiFade}
.in-drop{animation-name:fiDrop}
@keyframes fiPop{from{opacity:0;transform:translate(-50%,-50%) scale(.2)}
                 to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes fiSlide{from{opacity:0;transform:translate(-160%,-50%)}
                   to{opacity:1;transform:translate(-50%,-50%)}}
@keyframes fiFade{from{opacity:0}to{opacity:1}}
@keyframes fiDrop{from{opacity:0;transform:translate(-50%,-260%)}
                  to{opacity:1;transform:translate(-50%,-50%)}}
.fi.spin{animation-name:fiPop,fiSpin;animation-duration:.6s,3s;
         animation-iteration-count:1,infinite;animation-timing-function:cubic-bezier(.34,1.56,.64,1),linear}
@keyframes fiSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.fi.bob{animation-name:fiPop,fiBob;animation-duration:.6s,2.2s;
        animation-iteration-count:1,infinite;animation-delay:0s,.6s}
@keyframes fiBob{0%,100%{transform:translate(-50%,-50%) translateY(0)}
                 50%{transform:translate(-50%,-50%) translateY(-12px)}}

/* 镜头特效 */
.fx-zoom{animation:fxZoom 3.2s ease-in-out both}
@keyframes fxZoom{from{transform:scale(1)}to{transform:scale(1.12)}}
.fx-shake{animation:fxShake .5s ease-in-out 3}
@keyframes fxShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}
.fx-flash::after{
  content:'';position:absolute;inset:0;background:#fff;
  animation:fxFlash 1s ease-out both;pointer-events:none;
}
@keyframes fxFlash{from{opacity:.85}to{opacity:0}}
/* 扫描线：表现"机器在看" */
.fx-scan::before{
  content:'';position:absolute;left:0;right:0;height:26%;
  background:linear-gradient(rgba(90,200,255,0),rgba(90,200,255,.5),rgba(90,200,255,0));
  animation:fxScan 2s linear infinite;pointer-events:none;z-index:2;
}
@keyframes fxScan{from{top:-26%}to{top:100%}}

/* 旁白条：小灵灵 + 字幕，口型在这里继续对 */
.film-nar{
  display:flex;align-items:center;gap:14px;
  background:rgba(255,255,255,.92);border-radius:20px;
  padding:14px 18px;box-shadow:var(--shadow);min-height:92px;
}
.film-face{flex:none;width:76px;height:76px;position:relative;
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;background:rgba(255,240,247,.75)}
.film-face .ling-char{animation:none}
.film-face .ling-svg{overflow:visible}
.film-cap{
  flex:1;font-size:23px;font-weight:600;line-height:1.5;color:var(--ink);
  opacity:0;transition:opacity .25s;
}
.film-cap.show{opacity:1}
.film-cap span{animation:capIn .3s ease-out}
@keyframes capIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.film-skip{
  position:absolute;right:10px;top:10px;z-index:5;
  background:rgba(0,0,0,.35);color:#fff;border:0;
  padding:7px 16px;border-radius:99px;font-size:15px;font-weight:600;
  cursor:pointer;backdrop-filter:blur(4px);
}
.film-skip:active{transform:scale(.94)}

/* 看完后的两个出口：继续 / 再看一遍 */
.film-end{
  display:flex;gap:12px;justify-content:center;flex-wrap:wrap;
  animation:capIn .35s ease-out;
}
.btn.ghost{
  background:#fff;color:var(--ink-soft);
  box-shadow:0 4px 0 #e0d6ea;font-size:19px;padding:12px 22px;
}

@media (min-width:768px){ .film-cap{font-size:27px} }
@media (max-width:520px){
  .film-cap{font-size:19px}
  .film-face{width:52px;height:52px}
}

/* iPad 竖屏更大字 */
@media (min-width:768px){
  body{font-size:22px}
  .bubble{font-size:27px}
  .opt{font-size:24px}
}
@media (max-width:520px){
  .bins{flex-direction:column}
  .panda{width:68px;height:68px}
  .panda-face{font-size:40px}
  .bubble{font-size:21px;padding:15px 18px}
}

/* 通用内置矢量图标（替代 emoji，跨平台一致） */
.ic{width:1.15em;height:1.15em;display:inline-block;vertical-align:-.18em}
.mic-i .ic{width:1em;height:1em}

.ling-deco svg{width:100%;height:100%}

.easel svg{width:100%;height:100%}