body{margin:0;font-family:system-ui,sans-serif;background:#fafafa;color:#222}a{text-decoration:none;color:#000}.page-container{max-width:1080px;margin:0 auto;padding:3rem 1.5rem}.header{text-align:center;margin-bottom:2.5rem}.header h1{font-size:2.2rem;font-weight:700;margin-bottom:.5rem}.header p{color:#555;max-width:700px;margin:0 auto}.search{display:flex;justify-content:center;margin-bottom:1.5rem}.search input{width:100%;max-width:500px;padding:.6rem 1rem;border:1px solid #ddd;border-radius:20px;font-size:.95rem}.tabs{display:flex;justify-content:center;gap:1.2rem;margin-bottom:2rem;border-bottom:1px solid #eee;padding-bottom:.6rem;flex-wrap:wrap}.tabs a{text-decoration:none;color:#555;font-size:.9rem;padding:.3rem .6rem}.tabs a.active{font-weight:600;border-bottom:2px solid #000;color:#000}.section{margin-bottom:3rem}.section h2{font-size:1.25rem;font-weight:600;margin-bottom:.3rem}.subtitle{font-size:.85rem;color:#777;margin-bottom:1rem}.card-grid{display:grid;gap:1.05rem}.grid-4{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.grid-3{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.grid-2{grid-template-columns:repeat(auto-fill,minmax(400px,1fr))}.card{background:#fff;border:1px solid #eee;border-radius:12px;padding:1rem;box-shadow:0 1px 3px #0000000f;transition:box-shadow .25s ease}.card:hover{box-shadow:0 4px 12px #0000001f}.card img{border-radius:8px;margin-bottom:.8rem;width:100%;height:auto}.card.flex{display:flex;align-items:flex-start;gap:1rem}.card.flex img{width:60px;height:60px;margin:0}.card h3{font-size:1rem;font-weight:600;margin:0 0 .4rem}.card p{color:#555;font-size:.9rem;margin:0 0 .4rem}.card span{font-size:.75rem;color:#888}.rank{font-size:1.5rem;font-weight:700;color:#bbb;min-width:25px}.see-more{text-align:center;margin-top:1.2rem}.see-more button{background:#fff;border:1px solid #ddd;border-radius:20px;padding:.5rem 1.2rem;font-size:.9rem;cursor:pointer;transition:background .2s}.see-more button:hover{background:#f5f5f5}@media (max-width: 767px) and (min-width: 600px){.header h1{font-size:1.6rem}.tabs{justify-content:flex-start;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:.8rem}.grid-3,.grid-2{grid-template-columns:1fr 1fr}}@media (max-width: 599px){.grid-3,.grid-2{grid-template-columns:1fr}}.mag-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:1.5rem;margin-top:2rem}.mag-card{background:#e9e9eb;border-radius:12px;box-shadow:0 1px 3px #0000000f;transition:box-shadow .25s ease}.mag-small{background:#fff;padding:.8rem}.mag-small .mag-thumb{flex:0 0 82px}.mag-small .mag-thumb img{border-radius:9999px;width:82px;height:82px}.mag-card:hover{box-shadow:0 4px 12px #0000001f}.mag-content{padding:1.2rem 1.6rem 1.3rem;background-color:#fff}.mag-content h3{font-size:1rem;font-weight:600;margin:0 0 .3rem;color:#111}.mag-content p.mag-desc{font-size:.85rem;color:#555;margin:0 0 .4rem}.mag-meta{font-size:.75rem;color:#777}.mag-link-vertical{display:flex;flex-direction:column;text-decoration:none;color:inherit}.mag-large{overflow:hidden}.mag-content h3{font-size:1.4rem}.mag-large img{width:100%;border-radius:12px 12px 0 0;max-height:305px;object-fit:cover}.mag-content .mag-sub{font-size:1.2rem}.mag-link{display:flex;align-items:center;padding:.8rem;text-decoration:none;color:inherit;gap:1.5rem}.mag-thumb{flex:0 0 64px}.mag-thumb img{width:64px;height:64px;border-radius:8px;object-fit:cover}.mag-small .mag-content{flex:1;padding:0}.mag-right{display:flex;flex-direction:column;gap:1.05rem}@media (max-width: 992px){.mag-grid{grid-template-areas:"large large" "small1 small2" "small3 small4";grid-template-columns:1fr 1fr}}@media (max-width: 600px){.mag-grid{grid-template-areas:"large" "small1" "small2" "small3" "small4";grid-template-columns:1fr}.mag-large img{max-height:220px}.mag-small img{height:140px}}@media (max-width: 1199px) and (min-width: 992px){.mag-grid{grid-template-areas:"large large small1" "large large small2" "small3 small4 small4";grid-template-columns:2fr 2fr 1fr}.mag-large img{max-height:300px}}@media (max-width: 991px) and (min-width: 768px){.mag-grid{grid-template-areas:"large large" "small1 small2" "small3 small4";grid-template-columns:1fr 1fr}.mag-large img{max-height:260px}}@media (max-width: 767px) and (min-width: 600px){.mag-grid{grid-template-areas:"large" "small1 small2" "small3 small4";grid-template-columns:1fr 1fr}.mag-large img{max-height:220px}.mag-small img{height:140px}}@media (max-width: 599px){.mag-grid{grid-template-areas:"large" "small1" "small2" "small3" "small4";grid-template-columns:1fr}.mag-large img{max-height:200px}.mag-small img{height:130px}}