/* ============================================================
   灿小记 Memo · 公告 / 节日祝福弹窗引擎  v1.3.9
   三形态：fullscreen 全屏祝福 / modal 居中弹窗 / banner 顶部横幅
   高对比配色，四主题 + auto 映射，字体清晰为第一原则
   ============================================================ */
#annRoot{position:fixed;inset:0;z-index:99990;pointer-events:none;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
#annRoot *{box-sizing:border-box}
#annRoot [data-ann-theme="ocean"]{--abg:#ffffff;--afg:#0b2a4a;--amut:#42608a;--apri:#1d6fd8;--aprif:#ffffff;--af1:#0b3a6f;--af2:#1d6fd8;--aborder:#d7e4f5}
#annRoot [data-ann-theme="night"]{--abg:#0f1728;--afg:#e8f0fd;--amut:#a9bddf;--apri:#38bdf8;--aprif:#06223a;--af1:#0a0f1e;--af2:#173056;--aborder:#26385c}
#annRoot [data-ann-theme="han"]{--abg:#f7f2e6;--afg:#332c1e;--amut:#6f603f;--apri:#9a3b2e;--aprif:#fff7ee;--af1:#2b261d;--af2:#54462f;--aborder:#e0d4ba}
#annRoot [data-ann-theme="journal"]{--abg:#fff8ec;--afg:#5a4326;--amut:#8a6b43;--apri:#d98b3a;--aprif:#ffffff;--af1:#5c4326;--af2:#b07d4a;--aborder:#efdcb9}

/* ---------- 顶部横幅（可并存，不打断操作） ---------- */
.ann-banner-wrap{position:fixed;top:0;left:0;right:0;z-index:99991;display:flex;flex-direction:column;gap:8px;padding:calc(10px + env(safe-area-inset-top)) 12px 0;pointer-events:none}
.ann-banner{pointer-events:auto;display:flex;align-items:center;gap:12px;max-width:760px;width:100%;margin:0 auto;background:var(--abg);color:var(--afg);border:1px solid var(--aborder);border-left:4px solid var(--apri);border-radius:14px;padding:10px 12px;box-shadow:0 10px 30px rgba(15,30,60,.16);animation:annSlideDown .45s cubic-bezier(.21,1.02,.55,1)}
.ann-banner.out{animation:annSlideUp .3s ease forwards}
.ann-banner img{width:42px;height:42px;object-fit:cover;border-radius:10px;flex:0 0 42px}
.ann-banner .ann-b-ic{width:42px;height:42px;flex:0 0 42px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--apri) 16%,transparent);color:var(--apri)}
.ann-banner .ann-b-tx{flex:1 1 auto;min-width:0}
.ann-banner .ann-b-tt{font-size:14.5px;font-weight:700;line-height:1.35;color:var(--afg)}
.ann-banner .ann-b-bd{font-size:12.8px;line-height:1.5;color:var(--amut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:520px}
.ann-banner .ann-b-btns{display:flex;gap:8px;flex:0 0 auto;align-items:center}
.ann-banner .ann-x{background:transparent;border:none;color:var(--amut);font-size:18px;line-height:1;cursor:pointer;padding:4px;border-radius:8px}
.ann-banner .ann-x:hover{color:var(--afg);background:color-mix(in srgb,var(--afg) 8%,transparent)}
@keyframes annSlideDown{from{transform:translateY(-130%);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes annSlideUp{to{transform:translateY(-130%);opacity:0}}

/* ---------- 遮罩 ---------- */
.ann-mask{position:fixed;inset:0;z-index:99995;pointer-events:auto;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(8,14,28,.56);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:annFade .3s ease}
.ann-mask.out{animation:annFadeOut .28s ease forwards}
@keyframes annFade{from{opacity:0}to{opacity:1}}
@keyframes annFadeOut{to{opacity:0}}
.ann-fx{position:fixed;inset:0;z-index:99996;pointer-events:none;overflow:hidden}

/* ---------- 卡片：居中弹窗 ---------- */
.ann-card{position:relative;z-index:99997;width:100%;max-width:420px;background:var(--abg);color:var(--afg);border:1px solid var(--aborder);border-radius:20px;padding:26px 24px 22px;text-align:center;box-shadow:0 24px 70px rgba(5,15,35,.42);animation:annPop .42s cubic-bezier(.2,1.1,.36,1);max-height:88vh;overflow:auto}
.ann-card .ann-ico{width:60px;height:60px;margin:0 auto 12px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--apri) 15%,transparent);color:var(--apri)}
.ann-card img.ann-img{width:100%;max-height:210px;object-fit:cover;border-radius:14px;margin:0 auto 14px;display:block}
.ann-tt{font-size:21px;font-weight:800;line-height:1.35;margin:0 0 9px;color:var(--afg);word-break:break-word}
.ann-bd{font-size:15px;line-height:1.75;font-weight:500;color:var(--afg);white-space:pre-line;word-break:break-word;opacity:.96}
.ann-btns{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.ann-btns.row{flex-direction:row}
.ann-btns.row .ann-btn{flex:1}

/* ---------- 全屏祝福 ---------- */
.ann-full{position:relative;z-index:99997;width:100%;max-width:560px;text-align:center;color:#fff;padding:40px 30px 30px}
.ann-full .ann-fcard{position:relative;border-radius:26px;padding:42px 32px 30px;background:linear-gradient(155deg,var(--af1),var(--af2));border:1px solid rgba(255,255,255,.22);box-shadow:0 30px 90px rgba(0,0,0,.5);overflow:hidden;animation:annPop .5s cubic-bezier(.2,1.1,.36,1)}
.ann-full img.ann-img{width:100%;max-height:260px;object-fit:cover;border-radius:16px;margin:0 auto 18px;display:block;box-shadow:0 10px 30px rgba(0,0,0,.3)}
.ann-full .ann-tt{color:#fff;font-size:27px;font-weight:800;letter-spacing:.5px;text-shadow:0 2px 12px rgba(0,0,0,.28)}
.ann-full .ann-bd{color:rgba(255,255,255,.96);font-size:16px;line-height:1.85}
.ann-full .ann-btns{margin-top:26px}
.ann-full .ann-deco{position:absolute;font-size:30px;opacity:.5;pointer-events:none;user-select:none}

/* ---------- 按钮 ---------- */
.ann-btn{appearance:none;border:none;cursor:pointer;border-radius:999px;padding:12px 22px;font-size:15px;font-weight:700;font-family:inherit;line-height:1.2;transition:transform .15s,box-shadow .15s,background .15s,color .15s;min-height:44px}
.ann-btn:active{transform:scale(.965)}
.ann-btn.primary{background:var(--apri);color:var(--aprif);box-shadow:0 8px 20px color-mix(in srgb,var(--apri) 38%,transparent)}
.ann-btn.primary:hover{filter:brightness(1.06)}
.ann-btn.ghost{background:transparent;color:inherit;border:1.5px solid currentColor;opacity:.92}
.ann-btn.ghost:hover{background:color-mix(in srgb,currentColor 10%,transparent)}
.ann-banner .ann-btn{padding:8px 15px;font-size:13px;min-height:34px;border-radius:999px}
.ann-close{position:absolute;top:10px;right:12px;width:36px;height:36px;border-radius:50%;border:none;cursor:pointer;font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center;background:transparent;color:inherit;opacity:.7;z-index:3}
.ann-close:hover{opacity:1;background:color-mix(in srgb,currentColor 12%,transparent)}
.ann-full .ann-close{color:#fff}
.ann-mute{position:absolute;top:12px;left:12px;width:36px;height:36px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;background:transparent;color:inherit;opacity:.72;z-index:3}
.ann-full .ann-mute{color:#fff}
.ann-mute:hover{opacity:1;background:color-mix(in srgb,currentColor 12%,transparent)}
@keyframes annPop{from{transform:translateY(22px) scale(.94);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}

/* ---------- 灯笼（lantern） ---------- */
.ann-lantern{position:absolute;top:-10px;width:54px;text-align:center;pointer-events:none;animation:annSwing 3.2s ease-in-out infinite;transform-origin:top center;z-index:1}
.ann-lantern.l1{left:6%;animation-delay:0s}
.ann-lantern.l2{right:6%;animation-delay:.6s;top:-6px;width:46px}
.ann-lantern .lt{width:2px;height:26px;background:rgba(255,220,150,.7);margin:0 auto}
.ann-lantern .lb{width:42px;height:50px;border-radius:50%/46%;background:radial-gradient(circle at 50% 35%,#ffe08a,#e0392b 72%);box-shadow:0 0 26px rgba(255,120,60,.75);margin:-2px auto 0;position:relative}
.ann-lantern.l2 .lb{width:36px;height:43px}
.ann-lantern .lb::before,.ann-lantern .lb::after{content:"";position:absolute;left:50%;transform:translateX(-50%);background:#7a1d12;width:30px;height:3px;border-radius:2px}
.ann-lantern .lb::before{top:3px}.ann-lantern .lb::after{bottom:3px}
.ann-lantern .lf{width:3px;height:12px;background:#ffcf6e;margin:0 auto;border-radius:0 0 3px 3px}
@keyframes annSwing{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}

/* ---------- 手机适配 ---------- */
@media (max-width:560px){
  .ann-card{padding:24px 18px 18px;border-radius:18px}
  .ann-tt{font-size:19px}
  .ann-bd{font-size:14.5px}
  .ann-full .ann-fcard{padding:34px 20px 24px;border-radius:22px}
  .ann-full .ann-tt{font-size:23px}
  .ann-banner{flex-wrap:wrap;gap:8px}
  .ann-banner .ann-b-bd{white-space:normal;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical}
  .ann-banner .ann-b-btns{width:100%;justify-content:flex-end}
}
@media (prefers-reduced-motion:reduce){
  .ann-banner,.ann-card,.ann-full .ann-fcard,.ann-mask{animation:none!important}
  .ann-lantern{animation:none!important}
}

/* ---------- 富文本正文（受限子集，颜色继承主题，自定义字色生效） ---------- */
.ann-bd.ann-rich{white-space:normal;word-break:break-word}
.ann-bd.ann-rich h1{font-size:21px;font-weight:800;margin:10px 0 6px;line-height:1.4}
.ann-bd.ann-rich h2{font-size:18px;font-weight:700;margin:9px 0 5px;line-height:1.4}
.ann-bd.ann-rich h3{font-size:16px;font-weight:700;margin:8px 0 4px}
.ann-bd.ann-rich h4{font-size:15px;font-weight:700;margin:7px 0 4px}
.ann-bd.ann-rich p{margin:5px 0}
.ann-bd.ann-rich ul,.ann-bd.ann-rich ol{margin:5px 0;padding-left:22px}
.ann-bd.ann-rich li{margin:2px 0}
.ann-bd.ann-rich blockquote{border-left:3px solid currentColor;opacity:.88;padding-left:11px;margin:7px 0}
.ann-bd.ann-rich hr{border:none;border-top:1px solid currentColor;opacity:.25;margin:9px 0}
.ann-bd.ann-rich b,.ann-bd.ann-rich strong{font-weight:800}
.ann-full .ann-bd.ann-rich h1{font-size:23px}
.ann-b-bd.ann-rich{white-space:normal;text-align:left;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:560px){
  .ann-bd.ann-rich h1{font-size:19px}
  .ann-bd.ann-rich h2{font-size:17px}
}
