/* JOCD 0.5.1 */
:root{ --jocd-accent:#046006; --jocd-text:#111; --jocd-card-bg:#fff; --jocd-border:#e6e6e6; --jocd-stat-bg:#fff; }
.jocd-wrap { max-width: 1100px; margin: 0 auto; padding: 24px; color: var(--jocd-text); }
.jocd-title { font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.2rem); margin: 0 0 6px; }
.jocd-meta { display:flex; gap:.5rem .75rem; flex-wrap:wrap; color:#666; font-size:.92rem; margin:6px 0 16px; }
.jocd-pill { background:#eef7f0; border:1px solid #b7d8bd; padding:.25rem .6rem; border-radius:999px; font-size:.8rem; }
.jocd-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:16px; }
@media (max-width:480px){ .jocd-grid{ grid-template-columns: 1fr; } }
.jocd-card{ border:1px solid var(--jocd-border); border-radius:14px; overflow:hidden; background:var(--jocd-card-bg); display:flex; flex-direction:column; }
.jocd-card .collage{ display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:#f2f2f2; }
.jocd-card .collage img{ width:100%; height:110px; object-fit:cover; display:block; }
.jocd-card .inner{ padding:14px; display:flex; flex-direction:column; gap:8px; }
.jocd-card a{ color:var(--jocd-accent); text-decoration:none; }
.jocd-card a:hover{ text-decoration:underline; }
.jocd-section{ margin:24px 0; }
.jocd-section h3{ font-size:1.2rem; margin:12px 0 8px; }
.jocd-figures{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
@media (max-width:800px){ .jocd-figures{ grid-template-columns:1fr; } }
.jocd-figure img{ width:100%; height:auto; border-radius:10px; }
.jocd-caption{ color:#555; font-size:.95rem; margin-top:6px; }
.jocd-qa{ border:1px dashed #e0e0e0; border-radius:10px; padding:12px; margin:18px 0; background:#fafafa; }
.jocd-qa textarea{ width:100%; min-height:80px; }
.jocd-qa button{ margin-top:8px; background:var(--jocd-accent); color:#fff; border:none; padding:8px 12px; border-radius:8px; cursor:pointer; }
.jocd-qa button:hover{ opacity:.92; }
.jocd-answer{ background:#fff; border-left:3px solid var(--jocd-accent); padding:10px 12px; margin-top:12px; border-radius:6px; }
.jocd-pagination{ display:flex; justify-content:center; gap:10px; margin:26px 0; }
.jocd-stats{ display:flex; gap:12px; flex-wrap:wrap; margin: 0 0 12px; }
.jocd-stats .stat{ background:var(--jocd-stat-bg); border:1px solid var(--jocd-border); border-radius:10px; padding:8px 12px; }
.jocd-stats .stat strong{ display:block; font-size:1.1rem; color: var(--jocd-accent); }
.jocd-ref{ font-weight:600; color:#444; }
.jocd-authorline{ color:#555; font-size:.92rem; }
