.accordion-list{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px;display:grid}.category-card{background:var(--card-color);border:1px solid #ffffff0f;border-radius:18px;flex-direction:column;width:100%;min-height:420px;transition:background .18s,border-color .18s,transform .18s;display:flex;position:relative;overflow:hidden}.category-card:hover{background:var(--card-hover);border-color:#ffffff24;transform:translateY(-2px)}.card-header{aspect-ratio:16/9;background-color:var(--background-color);border-bottom:1px solid #ffffff0f;border-top-left-radius:18px;border-top-right-radius:18px;position:relative;overflow:hidden}.card-image{object-fit:cover;width:100%;height:100%;transition:transform .35s,opacity .4s}.category-card:hover .card-image{transform:scale(1.04)}.card-header:after{content:"";background:linear-gradient(#0000,#00000026);position:absolute;inset:0}.card-image-skeleton{z-index:1;background:linear-gradient(90deg,#ffffff0a 25%,#ffffff17 50%,#ffffff0a 75%) 0 0/200% 100%;animation:1.2s linear infinite skeletonLoading;position:absolute;inset:0}.card-image.hidden{opacity:0}.card-image.visible{opacity:1}@keyframes skeletonLoading{0%{background-position:200% 0}to{background-position:-200% 0}}.card-body{flex-direction:column;flex:1;gap:18px;padding:1.6rem;display:flex}.card-body h3{color:var(--title);letter-spacing:-.02em;font-size:1.45rem;font-weight:700;line-height:1.25}.card-body p{color:var(--subtitle-gray);-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:.95rem;line-height:1.65;display:-webkit-box;overflow:hidden}.card-meta{color:#7b7b7b;text-transform:uppercase;letter-spacing:.08em;align-items:center;gap:14px;font-size:.78rem;display:flex}.article-tags{flex-wrap:wrap;gap:8px;display:flex}.tag-label{color:#bdbdbd;background:#ffffff0a;border:1px solid #ffffff0f;border-radius:999px;padding:5px 10px;font-size:.74rem;font-weight:500}.progress-container{flex-direction:column;gap:8px;display:flex}.progress-bar{background:#1b1b1b;border-radius:999px;height:6px;margin:0;overflow:hidden}.progress-fill{background:var(--primary);height:100%;box-shadow:none;border-radius:999px}.progress-text{color:#9b9b9b;font-size:.82rem}.progress-complete{color:#67d46e;font-size:.82rem;font-weight:600}.toc-card-pr{background:0 0;border:1px solid #ffffff0f;border-left:none;border-right:none;border-radius:0;margin:0;padding:14px 0}.toc-card-pr-summary{cursor:pointer;color:#f3f3f3;justify-content:space-between;align-items:center;font-size:.92rem;font-weight:600;display:flex}.toc-card-pr-summary:after{content:"▾";color:#777;transition:all .2s}.toc-card-pr.open .toc-card-pr-summary:after{transform:rotate(180deg)}.toc-card-pr-content{grid-template-rows:0fr;transition:grid-template-rows .25s;display:grid}.toc-card-pr.open .toc-card-pr-content{grid-template-rows:1fr}.toc-card-pr-content ul{flex-direction:column;gap:8px;margin-top:12px;display:flex;overflow:hidden}.toc-card-pr li{color:#9f9f9f;font-size:.88rem;line-height:1.5}.read-btn{color:#fff;background:#181818;border:1px solid #ffffff14;border-radius:12px;justify-content:center;align-items:center;height:46px;margin-top:auto;font-weight:600;transition:all .18s;display:flex}.read-btn:hover{border-color:var(--primary);color:#fff;background:#202020}@media (max-width:768px){.category-card{min-height:auto}.card-body{padding:18px}.card-body h3{font-size:1.2rem}.card-body p{font-size:.88rem}}