/* Each card keeps its group's palette, independently of the site theme. */
.card[data-group-id]{--cta-a:#b85ca2;--cta-b:#9565c5}
.card[data-group-id="crush"]{--cta-a:#3d8dff;--cta-b:#5aa9ff}
.card[data-group-id="manifest"]{--cta-a:#f4a6c1;--cta-b:#b58be8}
.card[data-group-id="blackpink"]{--cta-a:#f7a8c4;--cta-b:#111111}
.card[data-group-id="bts"]{--cta-a:#8b6cf6;--cta-b:#6d55d9}
.card[data-group-id="straykids"]{--cta-a:#62688f;--cta-b:#dd789e}
.card[data-group-id="twice"]{--cta-a:#ff8fbd;--cta-b:#69c8ff}
body .card[data-group-id] .bottom{align-items:stretch;gap:12px}
body .card[data-group-id] .bottom>span{align-self:flex-start}
body .card[data-group-id] .bottom>a{
  display:flex;align-items:center;justify-content:center;gap:12px;
  width:100%;min-height:46px;padding:12px 16px;box-sizing:border-box;
  border:1px solid color-mix(in srgb,var(--cta-a) 35%,transparent);
  border-radius:14px;
  background:linear-gradient(115deg,color-mix(in srgb,var(--cta-a) 28%,white),color-mix(in srgb,var(--cta-b) 24%,white));
  color:#241c32;font-size:13px;font-weight:850;line-height:1.25;letter-spacing:.01em;
  text-decoration:none;box-shadow:0 4px 10px color-mix(in srgb,var(--cta-a) 15%,transparent),inset 0 1px 0 #ffffffb3;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}
body .card[data-group-id] .bottom>a:hover{
  text-decoration:none;transform:translateY(-2px);filter:saturate(1.2);
  box-shadow:0 7px 16px color-mix(in srgb,var(--cta-a) 25%,transparent),inset 0 1px 0 #ffffffb3;
}
body .card[data-group-id] .bottom>a:active{transform:translateY(0);box-shadow:none}
body .card[data-group-id] .bottom>a:focus-visible{outline:3px solid #241c32;outline-offset:3px}
body .card[data-group-id="blackpink"] .bottom>a{background:linear-gradient(115deg,#292129,#111111);color:#f7a8c4;border-color:#f7a8c4}
@media(max-width:600px){body .card[data-group-id] .bottom>a{min-height:44px;padding:11px 10px;font-size:12px;border-radius:12px}}
@media(prefers-reduced-motion:reduce){body .card[data-group-id] .bottom>a{transition:none}body .card[data-group-id] .bottom>a:hover{transform:none}}
