/* ============================================================
   1A.mom · 归零币纪念馆 首页大栏
   复用站点的 CSS 变量（--bg/--card/--border/--blue/--red/...），保证视觉统一
   ============================================================ */
.memorial{
  margin: 42px 0 10px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background:
    radial-gradient(900px 320px at 18% -10%, rgba(59,130,246,.13), transparent 68%),
    radial-gradient(700px 300px at 88% 0%, rgba(231,76,60,.09), transparent 66%),
    linear-gradient(180deg, rgba(19,26,42,.92), rgba(10,14,23,.96));
  overflow: hidden;
  position: relative;
}
.memorial::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:
    radial-gradient(1.4px 1.4px at 12% 22%, #fff, transparent),
    radial-gradient(1.1px 1.1px at 68% 12%, #cfe0ff, transparent),
    radial-gradient(1.2px 1.2px at 86% 44%, #fff, transparent),
    radial-gradient(1px 1px at 34% 72%, #dbe6ff, transparent),
    radial-gradient(1px 1px at 58% 58%, #fff, transparent);
  background-size: 420px 420px, 560px 560px, 700px 700px, 480px 480px, 620px 620px;
  mask-image: linear-gradient(180deg, #000, transparent 78%);
  -webkit-mask-image: linear-gradient(180deg, #000, transparent 78%);
}
.mem-head{position:relative; z-index:1; padding:30px 30px 0; text-align:center}
.mem-head h2{
  font-family: Georgia, "Songti SC", serif;
  font-size: clamp(23px, 3.4vw, 34px);
  letter-spacing:.5px; margin: 0 0 12px;
  background: linear-gradient(180deg, #fff 30%, #9fb0cc 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.mem-head h2 b{color: var(--blue); -webkit-text-fill-color: var(--blue)}
.mem-head p{color: var(--sub); font-size: 13.5px; margin: 0 auto; max-width: 720px; line-height: 1.75}
.mem-badge{
  display:inline-flex; align-items:center; gap:7px; margin-top:14px;
  background: rgba(59,130,246,.1); border:1px solid rgba(59,130,246,.3);
  color:#9dc0ff; font-size:11.5px; padding:4px 12px; border-radius:20px; letter-spacing:.4px;
}
.mem-badge i{width:6px; height:6px; border-radius:50%; background:var(--green); display:block}

.mem-body{
  position:relative; z-index:1;
  display:grid; grid-template-columns: minmax(0,1fr) minmax(0,.92fr);
  gap:26px; padding:26px 30px 32px; align-items:start;
}
@media(max-width:920px){
  .mem-body{grid-template-columns:1fr; padding:22px 18px 20px}
  .mem-head{padding:24px 18px 0}
  .mem-left{position:static; order:2}        /* 单栏时不要吸顶 */
  .mem-right{order:1}                        /* 单栏时输入框要排在墓碑前面，否则要先滚过一大块墓碑才能输入 */
  .mem-hall-wrap{padding:0 18px 24px}
}

.mem-canvas-wrap{
  border-radius:14px; overflow:hidden; border:1px solid var(--border);
  background:#05070d; box-shadow: 0 20px 50px rgba(0,0,0,.5);
}
#tombCv{width:100%; height:auto; display:block}

.mem-themes{display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; align-items:center}
.mem-themes .tl{color:var(--sub); font-size:12px; margin-right:2px}
.tbtn{
  display:inline-flex; align-items:center; gap:6px;
  background: var(--card); border:1px solid var(--border); color: var(--sub);
  padding:6px 11px; border-radius:20px; font-size:12px; cursor:pointer; transition:.15s;
  font-family:inherit;
}
.tbtn:hover{color:var(--txt); border-color:#2f3f5c}
.tbtn.on{border-color:#c9a961; color:var(--txt)}
.tbtn i{width:12px; height:12px; border-radius:4px; display:block}

.mem-actions{display:flex; gap:9px; margin-top:12px; flex-wrap:wrap}
.mem-actions button{
  flex:1; min-width:120px; display:inline-flex; align-items:center; justify-content:center; gap:7px;
  background: var(--card); border:1px solid var(--border); color: var(--txt);
  padding:12px 14px; border-radius:11px; font-size:13px; cursor:pointer; transition:.15s; font-family:inherit;
}
.mem-actions button:hover{border-color:var(--blue); transform:translateY(-1px)}
.mem-actions button.primary{
  background: linear-gradient(180deg,#5b8def,#3f6fd8); border-color:transparent; font-weight:700;
  box-shadow: 0 8px 22px rgba(59,130,246,.28);
}
.mem-actions button.ghost{color:var(--sub)}

/* 左栏吸顶：右栏（统计+来源）比墓碑高，滚动时让墓碑跟着走，避免左半边空一大片 */
.mem-left{position:sticky; top:16px; align-self:start}
.mem-hall-wrap{position:relative; z-index:1; padding:0 30px 30px}
.mem-right{display:flex; flex-direction:column; gap:14px}
.mem-form{display:flex; gap:9px}
#tombQ{
  flex:1; background:#0e1626; border:1px solid var(--border); color:var(--txt);
  padding:13px 15px; border-radius:11px; font-size:14px; outline:none; transition:.15s; font-family:inherit;
}
#tombQ:focus{border-color:var(--blue); box-shadow:0 0 0 3px rgba(59,130,246,.13)}
.mem-form button{
  background: linear-gradient(180deg,#5b8def,#3f6fd8); color:#fff; border:0;
  padding:13px 22px; border-radius:11px; font-size:14px; font-weight:700; cursor:pointer; font-family:inherit;
  white-space:nowrap;
}
.mem-form button:disabled{opacity:.55; cursor:progress}
.mem-quick{display:flex; gap:7px; flex-wrap:wrap; align-items:center; color:var(--sub); font-size:12px}
.mem-quick button{
  background:#0e1626; border:1px solid var(--border); color:var(--sub);
  padding:4px 11px; border-radius:16px; font-size:12px; cursor:pointer; transition:.15s; font-family:inherit;
}
.mem-quick button:hover{color:var(--txt); border-color:var(--blue)}
.mem-status{color:var(--sub); font-size:12.5px; min-height:18px}

/* ===== 右栏未查询时的“挖掘中”占位：填满空缺，与左侧无字碑呼应 ===== */
.dig-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  min-height:430px;padding:24px 18px;text-align:center;border-radius:14px;
  border:1px dashed rgba(124,110,220,.26);
  background:linear-gradient(180deg,rgba(19,26,42,.4),rgba(10,14,23,.2))}
.dig-scene{position:relative;width:184px;height:150px;margin-bottom:12px}
/* 墓坑：虚线轮廓 + 内侧渐深，看起来像个真挖开的坑而不是一圈扁椭圆 */
.dig-pit{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);width:146px;height:74px;
  border:2px dashed rgba(139,124,255,.5);border-radius:50%;
  background:radial-gradient(ellipse at 50% 118%, rgba(6,8,16,.98) 40%, rgba(12,16,30,.55) 78%, transparent 100%);
  box-shadow:inset 0 9px 18px rgba(0,0,0,.7);
  animation:pitbreathe 3.4s ease-in-out infinite}
@keyframes pitbreathe{0%,100%{opacity:.5}50%{opacity:1}}
/* 坑边堆起来的土 */
.dig-mound{position:absolute;bottom:12px;width:44px;height:17px;border-radius:50%;
  background:radial-gradient(ellipse at 50% 30%, #3a3157, #221c3a 70%, transparent);
  opacity:.85}
.dig-mound.l{left:6px} .dig-mound.r{right:6px;width:36px;height:14px;opacity:.7}
.dig-shovel{position:absolute;left:50%;bottom:52px;width:62px;height:62px;transform-origin:50% 90%;
  animation:digswing 1.9s cubic-bezier(.4,0,.6,1) infinite;filter:drop-shadow(0 5px 10px rgba(0,0,0,.5))}
@keyframes digswing{
  0%,100%{transform:translateX(-50%) rotate(-24deg) translateY(0)}
  34%{transform:translateX(-50%) rotate(17deg) translateY(11px)}
  52%{transform:translateX(-50%) rotate(6deg) translateY(3px)}
  70%{transform:translateX(-50%) rotate(-13deg) translateY(-3px)}}
.dig-dirt{position:absolute;left:50%;bottom:26px;width:6px;height:6px;border-radius:2px;
  background:#8b7cff;opacity:0;animation:dirtfly 1.9s ease-out infinite}
@keyframes dirtfly{
  0%,26%{opacity:0;transform:translateX(-50%) translateY(0) rotate(0) scale(.5)}
  40%{opacity:.95}
  78%{opacity:0;transform:translateX(calc(-50% + var(--dx,14px))) translateY(-34px) rotate(160deg) scale(1)}
  100%{opacity:0}}
.dig-empty .dig-title{font-size:15px;font-weight:700;color:#c9d2e6}
.dig-empty .dig-sub{font-size:12.5px;color:var(--sub);margin-top:2px}
.dig-empty .dig-hint{font-size:11.5px;color:#5d6779;margin-top:8px;line-height:1.65;max-width:290px}
@media (prefers-reduced-motion: reduce){
  .dig-pit,.dig-shovel,.dig-dirt{animation:none}
  .dig-dirt{opacity:.5}}
/* 空卡片不要显示成一条空条 */
.mem-stats:empty{display:none}
.mem-status:empty{display:none}

/* ===== 挖掘中状态：查询时保持铲子使劲铲 + “正在挖掘坟墓…” ===== */
.dig-empty .digging-only{display:none}
.dig-empty.digging{border-style:solid;border-color:rgba(139,124,255,.34);
  background:linear-gradient(180deg,rgba(24,32,52,.62),rgba(10,14,23,.34))}
.dig-empty.digging .idle-only{display:none}
.dig-empty.digging .digging-only{display:block}
/* 开挖时铲子频率加快、幅度加大：看得出“在干活” */
.dig-empty.digging .dig-shovel{animation:digswing .92s cubic-bezier(.4,0,.6,1) infinite}
.dig-empty.digging .dig-dirt{animation:dirtfly .92s ease-out infinite}
.dig-empty.digging .dig-pit{animation:pitbreathe 1.7s ease-in-out infinite}
.dig-empty.digging .dig-title{color:#dbe4ff}
/* 三点跳动 */
.dig-dots .dd{animation:dotblink 1.2s infinite}
.dig-dots .dd:nth-child(3){animation-delay:.16s}
.dig-dots .dd:nth-child(4){animation-delay:.32s}
.dig-dots .dd:nth-child(5){animation-delay:.48s}
@keyframes dotblink{0%,100%{opacity:.18}40%{opacity:1}}
/* 开挖时铲子下方加一圈“进度光晕”，让人知道确实在跑 */
.dig-empty.digging .dig-scene::after{content:"";position:absolute;left:50%;bottom:6px;transform:translateX(-50%);
  width:170px;height:96px;border-radius:50%;pointer-events:none;
  background:radial-gradient(ellipse at 50% 80%, rgba(139,124,255,.20), transparent 68%);
  animation:digglow 1.6s ease-in-out infinite}
@keyframes digglow{0%,100%{opacity:.35;transform:translateX(-50%) scale(.94)}50%{opacity:.95;transform:translateX(-50%) scale(1.05)}}
@media (prefers-reduced-motion: reduce){
  .dig-empty.digging .dig-shovel,.dig-empty.digging .dig-dirt,.dig-empty.digging .dig-pit{animation-duration:2.4s}
  .dig-empty.digging .dig-scene::after{animation:none;opacity:.6}
  .dig-dots .dd{animation:none;opacity:1}}
@media(max-width:920px){ .dig-empty{min-height:260px} }


.mem-status.err{color:#ff8b7f}
.mem-status .sp{
  display:inline-block; width:10px; height:10px; border:2px solid #2f3f5c; border-top-color:var(--blue);
  border-radius:50%; animation:memspin .7s linear infinite; vertical-align:-1px; margin-right:6px;
}
@keyframes memspin{to{transform:rotate(360deg)}}

.mem-stats{
  background: rgba(14,22,38,.72); border:1px solid var(--border); border-radius:13px; padding:4px 16px 10px;
}
.mem-stats .r{
  display:flex; justify-content:space-between; gap:12px; padding:10px 0;
  border-bottom:1px dashed rgba(255,255,255,.06); font-size:13px;
}
.mem-stats .r:last-child{border-bottom:0}
.mem-stats .k{color:var(--sub); white-space:nowrap}
.mem-stats .v{font-weight:600; text-align:right; font-variant-numeric:tabular-nums}
.v-red{color:#ff6b5e} .v-gold{color:#c9a961} .v-green{color:var(--green)} .v-sub{color:var(--sub)}
.mem-pill{display:inline-block; padding:2px 10px; border-radius:20px; font-size:11px; font-weight:700}
.p-legend{background:rgba(231,76,60,.16); color:#ff8b7f; border:1px solid rgba(231,76,60,.35)}
.p-buried{background:rgba(201,169,97,.14); color:#c9a961; border:1px solid rgba(201,169,97,.32)}
.p-dying{background:rgba(230,126,34,.14); color:#f0aa3c; border:1px solid rgba(230,126,34,.3)}
.p-alive{background:rgba(46,204,113,.13); color:var(--green); border:1px solid rgba(46,204,113,.3)}
.p-unknown{background:rgba(139,150,173,.12); color:var(--sub); border:1px solid var(--border)}

.mem-trace{
  background: rgba(14,22,38,.6); border:1px solid var(--border); border-radius:13px; padding:6px 16px 12px;
  font-size:12px;
}
/* 还没查任何币时不要把空卡片显示出来 */
.mem-trace:empty{display:none}
.mem-trace-wrap:has(.mem-trace:empty){padding-bottom:0}
.mem-trace .tr{display:flex; gap:10px; padding:8px 0; border-bottom:1px dashed rgba(255,255,255,.055); align-items:flex-start}
.mem-trace .tr:last-child{border-bottom:0}
.mem-trace .f{color:var(--txt); min-width:96px; font-weight:600}
.mem-trace .s{color:var(--blue); white-space:nowrap}
.mem-trace .d{color:var(--sub); flex:1; line-height:1.5; word-break:break-word}
.mem-trace .w{color:#f0aa3c}
.mem-foot{color:#5d6779; font-size:11.5px; line-height:1.7}
.mem-hint{color:#5d6779; font-size:11.5px; margin-top:8px}

/* 名人堂（死在同一个坑里的币） */
.mem-hall{margin-top:16px; display:grid; grid-template-columns:repeat(auto-fill,minmax(148px,1fr)); gap:10px}
.mem-card{
  background: rgba(14,22,38,.7); border:1px solid var(--border); border-radius:11px; padding:11px 12px;
  cursor:pointer; transition:.15s;
}
.mem-card:hover{border-color:#c9a961; transform:translateY(-2px)}
.mem-card .n{font-size:13.5px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mem-card .p{font-size:19px; font-weight:800; color:#ff6b5e; margin-top:4px; font-variant-numeric:tabular-nums}
.mem-card .t{font-size:11px; color:var(--sub); margin-top:2px}
.mem-card .t b{color:#c9a961}
