.mag-page{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;-webkit-text-size-adjust:100%;max-width:1200px;margin:0 auto;padding:0 20px}
.mag-page button,.mag-filter-btn{-webkit-appearance:none;appearance:none}
.mag-header{text-align:center;margin-bottom:40px}
.mag-header h2{font-family:'Lora',serif;font-size:32px;font-weight:700;color:#660E3D;margin-bottom:8px}
.mag-header p{font-size:15px;color:#888;max-width:600px;margin:0 auto;line-height:1.6}
.mag-header .mag-subtitle{font-size:13px;color:#D4A843;font-weight:600;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:10px;display:block}
.mag-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-bottom:36px}
.mag-filter-btn{padding:8px 18px;border:1.5px solid #e0ddd8;border-radius:24px;background:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;color:#666;font-family:inherit}
.mag-filter-btn:hover{border-color:#660E3D;color:#660E3D}
.mag-filter-btn.active{background:#660E3D;color:#fff;border-color:#660E3D}
.mag-year-section{margin-bottom:48px}
.mag-year-label{font-family:'Lora',serif;font-size:22px;font-weight:600;color:#1d1d1d;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid #f0ede8;display:flex;align-items:center;gap:10px}
.mag-year-label span{font-size:12px;font-weight:600;color:#999;background:#f5f4f1;padding:3px 10px;border-radius:12px}
.mag-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:28px}
.mag-card{text-decoration:none;color:inherit;display:block;transition:transform .3s ease}
.mag-card:hover{transform:translateY(-8px)}
.mag-card:hover .mag-cover{box-shadow:12px 12px 30px rgba(0,0,0,.2)}
.mag-cover{width:100%;aspect-ratio:3/4;border-radius:4px 12px 12px 4px;overflow:hidden;background:linear-gradient(160deg,#660E3D 0%,#8B1A55 100%);box-shadow:6px 6px 20px rgba(0,0,0,.12),0 0 1px rgba(0,0,0,.1);transition:box-shadow .3s ease;position:relative}
.mag-cover::before{content:'';position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(90deg,rgba(0,0,0,.15),rgba(0,0,0,.03));z-index:2}
.mag-cover::after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,rgba(255,255,255,.15) 0%,transparent 40%,transparent 60%,rgba(0,0,0,.04) 100%);z-index:1;pointer-events:none}
.mag-cover img{width:100%;height:100%;object-fit:cover;display:block;position:relative}
.mag-cover .mag-new{position:absolute;top:10px;right:10px;background:#660E3D;color:#fff;font-size:10px;font-weight:700;padding:4px 10px;border-radius:12px;text-transform:uppercase;letter-spacing:.5px;z-index:3}
.mag-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;padding:20px;text-align:center}
.mag-placeholder span{color:rgba(255,255,255,.9);font-family:'Lora',serif;font-size:14px;font-weight:600;line-height:1.3}
.mag-placeholder small{color:rgba(255,255,255,.5);font-size:11px}
.mag-cover img.loaded ~ .mag-placeholder{display:none}
.mag-label{font-size:13px;font-weight:600;color:#333;margin-top:12px;text-align:center}
.mag-dl{font-size:11px;color:#D4A843;font-weight:600;text-align:center;margin-top:3px;text-transform:uppercase;letter-spacing:.5px;opacity:0;transition:opacity .2s}
.mag-card:hover .mag-dl{opacity:1}
.mag-count{text-align:center;margin-top:40px;font-size:13px;color:#bbb;padding-bottom:20px}
.mag-loading{text-align:center;padding:60px 20px;color:#999}
.mag-loading .mag-spinner{width:28px;height:28px;border:3px solid #eee;border-top-color:#660E3D;border-radius:50%;animation:magspin .6s linear infinite;margin:0 auto 16px}
@keyframes magspin{to{transform:rotate(360deg)}}
@media(max-width:768px){.mag-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:20px}.mag-header h2{font-size:26px}.mag-filters{gap:4px}.mag-filter-btn{padding:6px 14px;font-size:12px}}
@media(max-width:480px){.mag-grid{grid-template-columns:repeat(2,1fr);gap:14px}}