/* 刊库「THE ARCHIVE」。深色底，文字居中，年份筛选，竖版封面横向排开（参考 GIA Gems & Gemology 的归档区）。
   博客页和 /magazine/ 各页共用。不依赖新的 Tailwind 类。 */
.mag-archive { background: radial-gradient(120% 140% at 70% 0%, #2b2622 0%, #1c1917 55%, #14110f 100%); color: #f4ecdf; }
.mag-archive-in { max-width: 1400px; margin: 0 auto; padding: 64px 16px 72px; text-align: center; }
@media (min-width: 768px) { .mag-archive-in { padding: 88px 32px 96px; } }
.mag-archive-head { display: flex; flex-direction: column; align-items: center; margin-bottom: 26px; }
.mag-archive-mark { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; background: #fdfbf7; color: #1c1917; font: 700 17px/1 "Songti SC", "Noto Serif SC", serif; clip-path: polygon(50% 0, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%); }
.mag-archive-en { margin: 14px 0 6px; font-family: "Playfair Display", "Cormorant Garamond", serif; font-size: 12px; letter-spacing: .5em; text-indent: .5em; text-transform: uppercase; color: #B89F77; }
.mag-archive h2 { margin: 0; font-family: "Songti SC", "Noto Serif SC", "Noto Serif CJK SC", serif; font-size: 32px; font-weight: 600; letter-spacing: .22em; text-indent: .22em; color: #fdfbf7; }
@media (min-width: 768px) { .mag-archive h2 { font-size: 44px; } }
.mag-archive-sub { margin: 12px 0 0; font-size: 13px; font-weight: 700; letter-spacing: .32em; text-indent: .32em; color: #B89F77; }
.mag-archive-rule { display: block; width: 40px; height: 2px; margin: 18px auto 0; background: #b72e29; }
.mag-archive-years { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0 0 34px; }
.mag-archive-years button { appearance: none; border: 1px solid rgba(229, 209, 176, .35); background: transparent; color: #E5D1B0; font: 500 12px/1 "Playfair Display", serif; letter-spacing: .16em; padding: 8px 16px; cursor: pointer; }
.mag-archive-years button.is-on, .mag-archive-years button:hover { background: #B89F77; border-color: #B89F77; color: #1c1917; }
.mag-archive-rail { position: relative; }
.mag-archive-row { display: flex; gap: 28px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 2px 18px; scrollbar-width: none; }
.mag-archive-row::-webkit-scrollbar { display: none; }
.mag-archive-card { flex: 0 0 168px; scroll-snap-align: center; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.mag-archive-card:first-child { margin-left: auto; }
.mag-archive-card:last-child { margin-right: auto; }
.mag-archive-card[hidden] { display: none; }
@media (min-width: 768px) { .mag-archive-card { flex-basis: 210px; } }
.mag-archive-main { display: block; width: 100%; color: inherit; text-decoration: none; }
.mag-archive-cover { display: block; aspect-ratio: 3 / 4; background: #2a2420; overflow: hidden; box-shadow: 0 18px 40px rgba(0, 0, 0, .45); }
.mag-archive-cover img { width: 100%; height: 100%; object-fit: cover; object-position: center 28%; transition: transform .45s ease; }
.mag-archive-main:hover .mag-archive-cover img { transform: scale(1.04); }
.mag-archive-vol { display: block; margin-top: 14px; text-align: center; }
.mag-archive-vol b { display: block; font: 500 13px/1.4 "Playfair Display", serif; letter-spacing: .2em; text-transform: uppercase; color: #fdfbf7; }
.mag-archive-vol i { display: block; margin-top: 2px; font: 500 12px/1.5 "Playfair Display", serif; font-style: normal; letter-spacing: .14em; color: #B89F77; }
.mag-archive-side { font-size: 11px; letter-spacing: .16em; color: #E5D1B0; text-decoration: none; border-bottom: 1px solid transparent; }
.mag-archive-side:hover { border-bottom-color: #E5D1B0; color: #fff; }
.mag-archive-arrow { position: absolute; top: 38%; z-index: 2; width: 40px; height: 40px; border: 1px solid rgba(229, 209, 176, .5); border-radius: 50%; background: rgba(28, 25, 23, .72); color: #fdfbf7; font-size: 22px; line-height: 1; cursor: pointer; }
.mag-archive-arrow[hidden] { display: none; }
.mag-archive-arrow:hover { background: #B89F77; border-color: #B89F77; color: #1c1917; }
.mag-archive-arrow.is-prev { left: -6px; }
.mag-archive-arrow.is-next { right: -6px; }
@media (min-width: 1500px) { .mag-archive-arrow.is-prev { left: -48px; } .mag-archive-arrow.is-next { right: -48px; } }
.mag-archive-status { margin: 8px 0 0; font-size: 13px; color: #cbbfae; }
@media (prefers-reduced-motion: reduce) {
  .mag-archive-cover img { transition: none; }
  .mag-archive-row { scroll-behavior: auto; }
}