.akari-pack{
  background: rgba(255,255,255,.60);
  border: 1px solid rgba(255,255,255,.75);
  border-radius: 18px;
  padding: 14px;
  margin: 14px 0;
  backdrop-filter: blur(8px);
  box-shadow: 0 12px 30px rgba(0,0,0,.08);
}
.akari-pack__title{
  font-weight: 900;
  margin: 0 0 10px;
}
.akari-month{font-size:12px;color:#666;font-weight:800;margin-left:6px}
.akari-muted{color:#777;font-size:13px}

.akari-name{display:flex;gap:10px;align-items:center}
#akari-name-input{
  flex:1;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.12);
  background: rgba(255,255,255,.8);
  font-weight: 700;
}
.akari-btn{
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.12);
  background: rgba(255,230,243,.95);
  font-weight: 900;
  cursor: pointer;
}

.akari-rank{list-style:none;margin:0;padding:0}
.akari-rank__item{
  display:flex;align-items:center;gap:10px;
  padding: 10px 10px;
  margin: 8px 0;
  border-radius: 14px;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.7);
}
.akari-rank__no{
  width:28px;height:28px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  font-weight:900;background:rgba(255,255,255,.8);
  border:1px solid rgba(255,255,255,.85);
}
.akari-rank__name{font-weight:900}
.akari-rank__meta{margin-left:auto;font-weight:800;color:#444;font-size:13px}
.akari-sub{color:#777;font-weight:700;margin-left:6px}

/* sparkle effect for top 3 */
.akari-rank__item--1, .akari-rank__item--2, .akari-rank__item--3{position:relative;overflow:hidden}
.akari-rank__item--1::after,
.akari-rank__item--2::after,
.akari-rank__item--3::after{
  content:"";
  position:absolute; inset:-30% -40%;
  background:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,.95), transparent 45%),
    radial-gradient(circle at 70% 60%, rgba(255,255,255,.75), transparent 52%);
  animation: akariTopSpark 3.4s ease-in-out infinite;
  pointer-events:none;
}
@keyframes akariTopSpark{
  0%{transform:translate(-4%, 2%) rotate(0deg); opacity:.35}
  50%{transform:translate(4%, -2%) rotate(8deg); opacity:.70}
  100%{transform:translate(-4%, 2%) rotate(0deg); opacity:.35}
}