/* 记忆实验馆: theatre-like stage, flash cards, recall chips, rings and the memory-palace cards. */
.memory-stage{display:grid;gap:14px;padding:22px;border-radius:24px;background:radial-gradient(120% 80% at 50% 0,color-mix(in srgb,var(--accent) 16%,var(--panel)),var(--panel) 70%);border:1px solid var(--line);min-height:120px}
.memory-stage:empty{display:none}
.memory-stage h3{font-size:20px;text-align:center}
.flash-card{min-height:150px;display:grid;place-items:center;font-size:64px}
.flash-card.flip,.memory-probe.flip{animation:card-flip .45s var(--spring)}
@keyframes card-flip{from{transform:perspective(600px) rotateX(-70deg);opacity:0}to{transform:none;opacity:1}}
.flash-dots{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}.flash-dots i{width:10px;height:10px;border-radius:50%;background:var(--soft)}.flash-dots i.on{background:var(--accent);box-shadow:0 0 10px var(--accent)}
.big-choice{display:grid;grid-template-columns:1fr 1fr;gap:12px}.big-choice .lab-button{min-height:64px;font-size:19px}
.recall-box{display:grid;gap:12px;justify-items:stretch}.recall-box h4{margin:0;font-size:19px;text-align:center}
.recall-box .count-ring{justify-self:center}
.count-ring{position:relative;width:120px;height:120px;justify-self:center;display:grid;place-items:center}
.count-ring svg{position:absolute;inset:0;transform:rotate(-90deg)}.count-ring circle{fill:none;stroke-width:9;stroke-linecap:round}.count-ring .cr-bg{stroke:var(--soft)}.count-ring .cr-fg{stroke:var(--accent)}
.count-ring b{font:850 34px var(--font);color:var(--accent);position:relative}.count-ring span{position:absolute;bottom:22px;font-size:13px;color:var(--muted)}
.digit-input{font:800 32px var(--mono)!important;letter-spacing:.3em;text-align:center}
.span-ladder{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.position-chart{display:grid;grid-template-columns:repeat(15,1fr);gap:4px;align-items:end;height:200px;padding:10px;background:var(--panel);border-radius:16px;border:1px solid var(--line)}
.pos-col{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px;min-width:0}
.pos-col i{width:70%;height:12%;border-radius:6px 6px 2px 2px;background:var(--soft);animation:grow .6s var(--spring) both}
.pos-col.hit i{height:70%;background:linear-gradient(var(--accent),var(--accent-2))}
@keyframes grow{from{transform:scaleY(0);transform-origin:bottom}}
.pos-col small{font-size:12px;color:var(--muted)}.pos-col span{font-size:11.5px;writing-mode:vertical-rl;color:var(--muted);max-height:60px;overflow:hidden}
.probe-q{color:var(--accent)}
.reminder-card{display:grid;gap:4px;padding:16px 18px;border-radius:18px;background:color-mix(in srgb,var(--accent-2) 16%,var(--panel));border:1px solid var(--accent-2)}.reminder-card b{font-size:18px}.reminder-card span{color:var(--muted);font-size:15px}
.loci-scene{border-radius:18px;max-height:340px;object-fit:cover;width:100%;animation:result-in .5s var(--spring)}
.loci-title{font-size:21px!important}
.loci-recall{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.loci-card{display:grid;gap:6px;padding:8px;border-radius:16px;background:var(--panel);border:1px solid var(--line)}.loci-card img{aspect-ratio:4/3;object-fit:cover;border-radius:10px}.loci-card b{font-size:15px}
.loci-card input.ok{border-color:var(--good)!important;background:color-mix(in srgb,var(--good) 12%,var(--panel))}.loci-card input.no{border-color:var(--bad)!important}
@media (max-width:720px){.memory-stage{padding:14px}.flash-card{font-size:46px;min-height:120px}.position-chart{height:160px}.pos-col span{display:none}.loci-recall{grid-template-columns:1fr 1fr}}