.mem-setup { max-width: 900px; margin: 0 auto; padding: 1rem 0 3rem; }
.mem-setup-title { font-family: var(--font-pixel); font-size: clamp(0.7rem,2vw,1.1rem); color: var(--secondary); text-shadow: var(--glow-s); text-align:center; letter-spacing:0.06em; margin-bottom: 0.4rem; }
.mem-setup-title span { color: var(--accent); text-shadow: var(--glow-a); }
.mem-setup-sub { font-family: var(--font-crt); font-size: 1.4rem; color: var(--muted); text-align:center; letter-spacing:0.15em; margin-bottom: 2rem; }

.diff-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1rem; }

.diff-card {
  background: var(--card);
  border: 2px solid var(--border);
  padding: 1.5rem 1.25rem;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.4rem;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}
.diff-card::before {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: var(--secondary);
  transform: scaleX(0);
  transition: transform 0.25s;
}
.diff-card:hover { border-color: var(--secondary); box-shadow: var(--glow-s); transform: translateY(-4px); }
.diff-card:hover::before { transform: scaleX(1); }
.diff-card.selected { border-color: var(--secondary); box-shadow: var(--glow-s); background: rgba(168,218,220,0.08); }

.diff-icon { font-size: 2.4rem; color: var(--secondary); margin-bottom: 0.25rem; display:block; }
.diff-name { font-family: var(--font-pixel); font-size: 0.65rem; color: var(--secondary); letter-spacing:0.08em; }
.diff-grid-size { font-family: var(--font-crt); font-size: 1.5rem; color: var(--white); }
.diff-theme { font-family: var(--font-crt); font-size: 1.1rem; color: var(--muted); }
.diff-pairs { font-family: var(--font-pixel); font-size: 0.38rem; color: var(--muted); letter-spacing:0.06em; margin-top:0.4rem; border: 1px solid var(--border); padding: 0.2rem 0.5rem; }

.mem-hud {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--surface);
  border: 1px solid var(--border);
  padding: 0.75rem 1.25rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.mem-hud-left { flex: 1; min-width: 0; }
.mem-hud-title { font-family: var(--font-pixel); font-size: 0.55rem; color: var(--secondary); text-shadow: var(--glow-s); letter-spacing:0.06em; }
.mem-hud-theme { font-family: var(--font-crt); font-size: 1.1rem; color: var(--muted); margin-top: 0.2rem; }

.mem-hud-stats { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.mem-stat-box { text-align: center; min-width: 52px; }
.mem-stat-val { font-family: var(--font-crt); font-size: 2rem; color: var(--secondary); text-shadow: var(--glow-s); display:block; line-height:1; }
.mem-stat-key { font-family: var(--font-pixel); font-size: 0.38rem; color: var(--muted); letter-spacing:0.08em; }

.mem-grid-wrap { overflow-x: auto; }

.mem-grid {
  display: grid;
  gap: 7px;
  margin: 0 auto;
  width: fit-content;
  max-width: 100%;
}

.mem-card {
  cursor: pointer;
  perspective: 700px;
  transition: transform 0.12s;
}
.mem-card:hover:not(.mem-matched):not(.mem-flipped) { transform: scale(1.04); }
.mem-card:active:not(.mem-matched) { transform: scale(0.97); }

.mem-card-inner {
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transition: transform 0.42s cubic-bezier(.4,.2,.2,1);
  position: relative;
}
.mem-card.mem-flipped .mem-card-inner,
.mem-card.mem-matched .mem-card-inner { transform: rotateY(180deg); }

.mem-face, .mem-back {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  backface-visibility: hidden;
  border-radius: 2px;
  padding: 6px;
  text-align: center;
}

.mem-face {
  background: var(--card);
  border: 2px solid var(--border);
}
.mem-face-deco {
  font-size: 1.6rem;
  color: rgba(69,123,157,0.35);
  display: block;
}
.mem-face-num {
  font-family: var(--font-pixel);
  font-size: 0.35rem;
  color: rgba(168,218,220,0.25);
  margin-top: 3px;
}

.mem-back {
  background: var(--card-hover);
  border: 2px solid var(--primary);
  transform: rotateY(180deg);
}
.mem-back.term-card {
  border-color: var(--secondary);
  background: rgba(168,218,220,0.08);
}
.mem-back.def-card {
  border-color: var(--primary);
  background: rgba(69,123,157,0.08);
}

.mem-card.mem-matched .mem-back {
  border-color: var(--secondary);
  background: rgba(168,218,220,0.15);
  box-shadow: 0 0 10px rgba(168,218,220,0.3);
}
.mem-card.mem-wrong .mem-card-inner { animation: wrong-shake 0.4s ease; }

@keyframes wrong-shake {
  0%,100%{transform:rotateY(180deg) translateX(0)}
  25%{transform:rotateY(180deg) translateX(-5px)}
  75%{transform:rotateY(180deg) translateX(5px)}
}

.mem-back-icon { font-size: 1.5rem; display:block; margin-bottom: 3px; color: var(--secondary); }
.mem-back-text {
  font-family: var(--font-pixel);
  line-height: 1.6;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.term-card .mem-back-text { font-size: 0.45rem; color: var(--secondary); }
.def-card .mem-back-text  { font-size: 0.35rem; color: var(--white); font-family: var(--font-crt); font-size: 0.9rem; }

.mem-controls {
  display: flex;
  gap: 0.75rem;
  margin-top: 1rem;
  flex-wrap: wrap;
}

.mem-combo-flash {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  font-family: var(--font-pixel);
  font-size: 1.2rem;
  color: var(--secondary);
  text-shadow: var(--glow-s);
  background: rgba(8,8,16,0.85);
  border: 2px solid var(--secondary);
  padding: 0.75rem 1.5rem;
  z-index: 5000;
  pointer-events: none;
  animation: combo-pop 0.8s ease forwards;
}
@keyframes combo-pop {
  0%{opacity:0;transform:translate(-50%,-50%) scale(0.6)}
  30%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}
  70%{opacity:1;transform:translate(-50%,-50%) scale(1)}
  100%{opacity:0;transform:translate(-50%,-60%) scale(0.9)}
}

@media(max-width:600px){
  .diff-grid{grid-template-columns:1fr 1fr;}
  .mem-hud{flex-direction:column;align-items:flex-start;}
}