/* Shared material cards: home, catalog, categories, search and related materials. */
body.colect-refresh #page ul.products {
    display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:24px !important; width:100% !important; margin:0 !important; padding:0 !important;
}
body.colect-refresh #page ul.products::before,
body.colect-refresh #page ul.products::after { display:none !important; }
body.colect-refresh #page ul.products > li.product {
    float:none !important; width:auto !important; max-width:none !important; min-width:0 !important;
    margin:0 !important; padding:0 !important; clear:none !important;
}
body.colect-refresh #page ul.products > li.colect-material-card { display:block !important; }
.colect-material-inner { display:flex; flex-direction:column; height:100%; overflow:hidden; border:1px solid var(--colect-line); border-radius:10px; background:#fff; }
.colect-material-image { display:block; aspect-ratio:3/2; background:var(--colect-purpose-image-bg,#faf3e9); border-bottom:1px solid var(--colect-line); }
body.colect-refresh #page .colect-material-image img { display:block; width:100% !important; height:100% !important; aspect-ratio:3/2; object-fit:contain !important; margin:0 !important; padding:12px; }
.colect-material-content { display:flex; flex-direction:column; flex:1; padding:18px; min-width:0; }
.colect-material-labels { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; font-size:11px; line-height:1.7; }
.colect-material-labels > span { padding:3px 7px; border-radius:4px; background:#eef3f7; color:#526879; }
.colect-material-labels > .colect-access-open { background:#e0effa; color:#28688f; }
/* Purpose accents match the blue lesson and purple school-work entry cards. */
/* Warm beige keeps "other" distinct from the pale blue lesson cards. */
.colect-material-card { --colect-purpose-color:#7a6043; --colect-purpose-bg:#f2e8db; --colect-purpose-image-bg:#faf3e9; }
.colect-material-card.colect-purpose-lesson { --colect-purpose-color:#2b6c98; --colect-purpose-bg:#e0effa; --colect-purpose-image-bg:#f0f6fc; }
.colect-material-card.colect-purpose-admin { --colect-purpose-color:#76528f; --colect-purpose-bg:#eae0f2; --colect-purpose-image-bg:#f6f2fa; }
.colect-material-card .colect-material-inner { border-top:4px solid var(--colect-purpose-color); }
.colect-material-labels > .colect-purpose-label { background:var(--colect-purpose-bg); color:var(--colect-purpose-color); font-weight:700; }
body.colect-refresh #page .colect-material-card h2 { margin:0 0 12px !important; padding:0 !important; height:auto !important; min-height:0 !important; max-height:none !important; font-size:16px !important; line-height:1.7 !important; overflow:visible !important; }
body.colect-refresh #page .colect-material-card h2 a { display:block; white-space:normal !important; overflow:visible !important; max-height:none !important; color:var(--colect-ink) !important; font-size:inherit !important; line-height:inherit !important; overflow-wrap:anywhere; }
.colect-material-formats { margin:0 0 16px; color:#607588; font-size:12px; }
.colect-material-footer { margin-top:auto; padding-top:12px; display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; }
body.colect-refresh #page .colect-material-footer a.colect-button { min-height:42px; padding:9px 14px; gap:16px; font-size:13px; }
body.colect-refresh #page .colect-material-footer .colect-product-card-actions { margin:0 !important; padding:0 !important; }
/* Download counts are emitted only when positive (including the single page). */
.colect-library-intro { margin:0 0 24px; }
.colect-library-intro h1 { color:var(--colect-ink); font-size:30px; line-height:1.5; margin:0 0 12px; }
.colect-library-intro p { color:#586e82; font-size:14px; line-height:1.9; }
/* A single consistent grid makes the old grid/list toggle unnecessary. */
.colect-refresh #mf-catalog-toolbar .shop-view { display:none; }
/* Restore the homepage's four-item ranking, including AJAX period changes. */
body.colect-refresh #page #colect-home-rank ul.products { grid-template-columns:repeat(4,minmax(0,1fr)) !important; }
/* Number the displayed order again whenever AJAX replaces the ranking list. */
body.colect-refresh #page #colect-home-rank ul.products { counter-reset:colect-rank; }
body.colect-refresh #page #colect-home-rank ul.products > li.product { position:relative; counter-increment:colect-rank; }
body.colect-refresh #page #colect-home-rank ul.products > li.product::before { content:counter(colect-rank) "位"; position:absolute; top:12px; left:12px; z-index:2; padding:5px 10px; border-radius:5px; background:var(--colect-accent); color:#fff; font-size:15px; font-weight:700; line-height:1.5; pointer-events:none; }
body.colect-refresh #page #colect-home-rank ul.products > li.product:first-child::before { background:#8b641a; }
@media (max-width:991px) {
    body.colect-refresh #page ul.products { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:18px !important; }
    body.colect-refresh #page #colect-home-rank ul.products { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width:600px) {
    body.colect-refresh #page ul.products { grid-template-columns:minmax(0,1fr) !important; gap:20px !important; }
    body.colect-refresh #page #colect-home-rank ul.products { grid-template-columns:minmax(0,1fr) !important; }
    .colect-material-content { padding:16px; }
    .colect-library-intro h1 { font-size:24px; }
    .colect-home-section-title { display:block; }
    .colect-home-section-title > a { display:inline-block; margin-top:8px; }
    body.colect-refresh #page #colect-home-recent ul.products > li.product:nth-child(n+4) { display:none !important; }
}