/* ==========================================================================
   MEMORY.CSS — "AI Memory" returning-visitor welcome card.
   Logic lives in js/memory.js. Pure LocalStorage, no login, no server.
   ========================================================================== */

.memory-card{
  position:fixed; top:96px; right:24px; z-index:var(--z-memory);
  width:300px; max-width:calc(100vw - 32px);
  background:rgba(17,22,31,.78); border:1px solid rgba(var(--accent-rgb),.3);
  border-radius:var(--radius-l); padding:20px;
  backdrop-filter:blur(22px) saturate(160%); -webkit-backdrop-filter:blur(22px) saturate(160%);
  box-shadow:var(--shadow-l), 0 0 40px rgba(var(--accent-rgb),.15);
  opacity:0; transform:translateY(-16px) scale(.97); pointer-events:none;
  transition:opacity .5s var(--ease-spring), transform .5s var(--ease-spring), border-color .6s ease, box-shadow .6s ease;
}
.memory-card.is-shown{ opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }

.memory-card-close{
  position:absolute; top:10px; right:12px; background:none; border:none;
  color:var(--text-mute); font-size:1.1rem; line-height:1; cursor:pointer;
  transition:color .2s ease;
}
.memory-card-close:hover{ color:var(--text); }

.memory-eyebrow{
  font-size:.66rem; color:var(--accent); text-transform:uppercase;
  letter-spacing:.14em; margin:0 0 6px;
}
.memory-title{ font-family:var(--font-display); font-size:1.15rem; margin:0 0 10px; }
.memory-line{ font-size:.83rem; color:var(--text-dim); margin:0 0 4px; }

.memory-explored-label{
  font-family:var(--font-mono); font-size:.68rem; color:var(--text-mute);
  text-transform:uppercase; letter-spacing:.1em; margin:12px 0 6px;
}
.memory-explored-list{
  list-style:none; margin:0 0 12px; padding:0;
  display:flex; flex-direction:column; gap:3px;
  font-size:.82rem; color:var(--text-dim);
}

.memory-achievement{
  font-size:.78rem; color:var(--gold);
  background:rgba(209,162,78,.1); border:1px solid rgba(209,162,78,.3);
  border-radius:var(--radius-s); padding:8px 10px; margin-bottom:12px;
}

.memory-resume{ width:100%; justify-content:center; }

@media (max-width:820px){
  .memory-card{ top:auto; bottom:96px; right:16px; }
}
@media (prefers-reduced-motion: reduce){
  .memory-card{ transition-duration:.001ms; }
}
