.doujin-card{
  --dc-title-size:clamp(20px,2.2vw,28px);
  --dc-tax-size:14px;
  --dc-chip-size:.92rem;
  --dc-aff-size:1rem;

  display:grid; grid-template-columns:360px 1fr; gap:24px;
  padding:20px; border-radius:16px; background:#122033; color:#fff;
  box-shadow:0 8px 20px rgba(0,0,0,.25);
}
.dc__media{align-self:start}
.dc__thumb{width:100%; height:auto; border-radius:12px; display:block}

.dc__title{
  font-size:var(--dc-title-size);
  line-height:1.4; margin:0 0 16px; font-weight:800; letter-spacing:.02em;
}
.dc__row{
  display:flex; gap:12px; align-items:flex-start;
  border-top:1px solid rgba(255,255,255,.08); padding:12px 0;
}
.dc__row:first-of-type{ border-top:none; padding-top:0 }
.dc__label{ flex:0 0 122px; opacity:.9; font-weight:700; font-size:var(--dc-tax-size) }
.dc__chips{ display:flex; flex-wrap:wrap; gap:10px }
.dc__chip{
  display:inline-block; padding:.42rem .72rem; border-radius:999px;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14);
  font-size:var(--dc-chip-size); line-height:1; text-decoration:none; color:#fff;
  transition:transform .05s ease, background .2s ease, border-color .2s ease;
}
.dc__chip:hover{ transform:translateY(-1px); background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.24) }

.dc__actions{ margin-top:16px }
.dc__btn{
  display:inline-block; padding:.75rem 1rem; border-radius:999px;
  background:#e83e8c; color:#fff; text-decoration:none; font-weight:700;
  box-shadow:0 6px 14px rgba(232,62,140,.35);
}
.dc__btn:hover{ filter:brightness(1.05) }

.dc__affiliate{ margin-top:16px; font-size:var(--dc-aff-size) }
.dc__affiliate.is-center{ display:flex; justify-content:center }
.dc__affiliate.is-right{ display:flex; justify-content:flex-end }
.dc__affiliate.is-stretch > *{ width:100% }

.dc__debug{
  margin-top:10px; font:12px/1.5 ui-monospace,Menlo,Consolas,monospace;
  background:#0d1726; border:1px solid rgba(255,255,255,.1);
  padding:10px; border-radius:8px; white-space:pre-wrap
}

@media (max-width:840px){
  .doujin-card{
    grid-template-columns:1fr; gap:16px; padding:16px; border-radius:14px;
  }
  .dc__label{ flex-basis:90px }
  .dc__title{ margin-bottom:10px }
}