/* ===== MIUS article detail page ===== */
.art { --a-green:#075e54; --a-green-d:#064b44; --a-gold:#c9a227; --a-ink:#102a2a; --a-text:#3f4e4e; --a-mute:#7a8888; --a-line:#e2e9e8; --a-paper:#f6f8f7;
       background:#fff; color:var(--a-text); font-family:'Inter',system-ui,sans-serif; padding-bottom:72px; }
.art-section { padding:0; }
.art-wrap { padding-top:0; padding-bottom:0; }   /* width & side padding come from the site's own .wrap.container, like every other section */
.art a { color:var(--a-green); }

.art-crumbs { display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:26px 0 0; font-size:.84rem; color:var(--a-mute); }
.art-crumbs a { color:var(--a-mute); text-decoration:none; }
.art-crumbs a:hover { color:var(--a-green); text-decoration:underline; }
.art-crumbs [aria-current] { color:var(--a-ink); }
.art-draft { margin:18px 0 0; padding:10px 14px; background:#fff6dc; border-left:4px solid var(--a-gold); font-size:.9rem; color:#6b5200; }

.art-head { padding:44px 0 34px; }
.art-title { font-family:'Playfair Display',Georgia,serif; font-weight:700; color:var(--a-ink); font-size:clamp(1.65rem,3.4vw,2.55rem); line-height:1.22; letter-spacing:-.01em; margin:0; }
.art-title.is-oneline { white-space:nowrap; overflow:hidden; }
.art-authors { margin:16px 0 0; font-size:1.08rem; font-weight:600; color:var(--a-green); }

/* hero: cover + facts */
.art-hero { display:grid; grid-template-columns:240px 1fr; gap:44px; padding:36px 0; border-top:1px solid var(--a-line); border-bottom:1px solid var(--a-line); align-items:start; }
.art-cover img { display:block; width:100%; height:auto; border-radius:3px; box-shadow:0 18px 36px -16px rgba(16,42,42,.45), 0 2px 6px rgba(16,42,42,.12); }
.art-cover-auto { position:relative; aspect-ratio:3/4; background:linear-gradient(90deg,var(--a-green-d) 0 14%, #fbfaf5 14% 100%); border-radius:3px 6px 6px 3px;
    box-shadow:0 18px 36px -16px rgba(16,42,42,.45), 0 2px 6px rgba(16,42,42,.12); display:flex; flex-direction:column; padding:22px 18px 18px 30%; color:var(--a-ink); overflow:hidden; }
.art-cover-auto::after { content:""; position:absolute; left:14%; top:0; bottom:0; width:3px; background:var(--a-gold); }
.acv-journal { font-family:'Playfair Display',Georgia,serif; font-weight:700; font-size:.92rem; line-height:1.3; }
.acv-num { font-family:'Playfair Display',Georgia,serif; font-weight:700; font-size:5.6rem; line-height:1; color:var(--a-green); margin-top:auto; }
.acv-meta { font-size:.8rem; font-weight:600; line-height:1.5; margin-top:8px; }
.acv-issn { font-size:.68rem; color:var(--a-mute); margin-top:14px; padding-top:10px; border-top:1px solid var(--a-line); }

.art-meta { margin:0; }
.art-meta > div { display:grid; grid-template-columns:150px 1fr; gap:18px; padding:11px 0; border-bottom:1px solid var(--a-line); }
.art-meta > div:first-child { padding-top:0; }
.art-meta dt { font-size:.86rem; color:var(--a-mute); font-weight:500; }
.art-meta dd { margin:0; color:var(--a-ink); font-weight:500; overflow-wrap:anywhere; }
.art-doi { color:var(--a-green); text-decoration:none; border-bottom:1px solid rgba(7,94,84,.35); }
.art-doi:hover { border-bottom-color:var(--a-green); }
.art-copy { border:0; background:none; color:var(--a-mute); cursor:pointer; padding:2px 6px; margin-left:4px; border-radius:4px; }
.art-copy:hover { color:var(--a-green); background:var(--a-paper); }
.art-none { color:var(--a-mute); font-weight:400; font-style:italic; }
.art-kw { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.art-kw button { font:inherit; font-size:.86rem; font-weight:500; color:var(--a-green); background:var(--a-paper); border:1px solid var(--a-line); border-radius:999px; padding:4px 13px; cursor:pointer; transition:background .2s,color .2s,border-color .2s; }
.art-kw button:hover { background:var(--a-green); color:#fff; border-color:var(--a-green); }

.art-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; }
.art-btn { display:inline-flex; align-items:center; gap:9px; font:inherit; font-weight:600; font-size:.94rem; padding:12px 22px; border-radius:6px; border:1.5px solid transparent; cursor:pointer; text-decoration:none; transition:background .2s,color .2s,border-color .2s; }
.art .art-btn-primary { background:var(--a-green); color:#fff; }
.art .art-btn-primary:hover { background:var(--a-green-d); }
.art .art-btn-ghost { background:#fff; color:var(--a-green); border-color:var(--a-green); }
.art .art-btn-ghost:hover { background:var(--a-green); color:#fff; }
.art-btn-disabled { background:var(--a-paper); color:var(--a-mute); border-color:var(--a-line); cursor:not-allowed; }
.art-btn-sm { padding:8px 14px; font-size:.84rem; }
.art-btn:focus-visible, .art-kw button:focus-visible, .art-copy:focus-visible, .art-pager a:focus-visible, .art-issue a:focus-visible { outline:3px solid rgba(201,162,39,.7); outline-offset:2px; }

.art-pdf { margin:28px 0 0; border:1px solid var(--a-line); border-radius:8px; overflow:hidden; }
.art-pdf iframe { display:block; width:100%; height:78vh; border:0; background:var(--a-paper); }

/* content */
.art-grid { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:40px; padding-top:40px; align-items:start; }
.art-card { background:#fff; border:1px solid var(--a-line); border-radius:8px; padding:30px 32px; }
.art-main .art-card + .art-card { margin-top:24px; }
.art-card h2 { font-family:'Playfair Display',Georgia,serif; font-size:1.4rem; color:var(--a-ink); margin:0 0 18px; padding-bottom:12px; border-bottom:2px solid var(--a-gold); display:inline-block; }
#abstract p { font-size:1.02rem; line-height:1.85; margin:0 0 1em; text-align:justify; hyphens:auto; -webkit-hyphens:auto; }
#abstract p:last-child { margin-bottom:0; }
.art-refs { margin:0; padding-left:1.6em; }
.art-refs li { font-size:.94rem; line-height:1.7; margin:0 0 .75em; padding-left:.3em; overflow-wrap:anywhere; text-align:justify; hyphens:auto; -webkit-hyphens:auto; }
.art-refs li::marker { color:var(--a-green); font-weight:600; }

.art-side { display:flex; flex-direction:column; gap:24px; }
.art-side .art-card { padding:22px 22px 24px; background:var(--a-paper); border-color:transparent; }
.art-side h2 { font-size:1.12rem; margin-bottom:14px; padding-bottom:8px; }
.art-cite-text { font-size:.88rem; line-height:1.65; margin:0 0 14px; color:var(--a-ink); overflow-wrap:anywhere; }
.art-cite-btns { display:flex; flex-wrap:wrap; gap:8px; }
.art-issue-sub { margin:-4px 0 12px; font-size:.82rem; color:var(--a-mute); }
.art-issue ul { list-style:none; margin:0; padding:0; }
.art-issue li { border-left:3px solid var(--a-line); }
.art-issue li a { display:block; padding:8px 12px; font-size:.86rem; line-height:1.4; color:var(--a-text); text-decoration:none; }
.art-issue li a:hover { color:var(--a-green); background:#fff; }
.art-issue li.is-current { border-left-color:var(--a-gold); background:#fff; }
.art-issue li.is-current a { color:var(--a-ink); font-weight:600; }
.art-all { display:inline-block; margin-top:14px; font-size:.86rem; font-weight:600; text-decoration:none; }
.art-all:hover { text-decoration:underline; }

.art-pager { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:44px; }
.art-pager a { display:block; padding:18px 22px; border:1px solid var(--a-line); border-radius:8px; text-decoration:none; color:var(--a-ink); transition:border-color .2s, background .2s; }
.art-pager a:hover { border-color:var(--a-green); background:var(--a-paper); }
.art-pager small { display:block; font-size:.78rem; color:var(--a-mute); margin-bottom:4px; }
.art-pager span { font-weight:600; font-size:.95rem; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.art-next { text-align:right; grid-column:2; }

.art-toast { position:fixed; left:50%; bottom:28px; transform:translateX(-50%); background:var(--a-ink,#102a2a); color:#fff; padding:10px 18px; border-radius:6px; font-size:.9rem; z-index:99999; opacity:0; transition:opacity .2s; pointer-events:none; }
.art-toast.on { opacity:1; }

@media (max-width: 900px) {
  .art-hero { grid-template-columns:1fr; gap:28px; }
  .art-cover { width:200px; }
  .art-grid { grid-template-columns:1fr; }
  .art-side { position:static; }
}
@media (max-width: 560px) {
  .art-meta > div { grid-template-columns:1fr; gap:3px; }
  .art-card { padding:22px 18px; }
  .art-pager { grid-template-columns:1fr; }
  .art-next { grid-column:auto; }
  .art-btn { flex:1 1 100%; justify-content:center; }
}
@media (prefers-reduced-motion: reduce) { .art * { transition:none !important; } }
