.section-intro{background:var(--bg);padding:2.5rem 2rem 0}.section-intro__inner{max-width:900px;margin:0 auto;display:flex;align-items:baseline;justify-content:space-between;gap:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--border);flex-wrap:wrap}.section-intro__label{font-size:.75rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);margin-bottom:.4rem}.section-intro__heading{font-family:var(--font-serif);font-size:1.25rem;font-weight:700;color:var(--text)}.section-intro__meta{font-size:.85rem;color:var(--text-subtle);margin-top:.3rem}.filter-group{display:flex;gap:.4rem;flex-wrap:wrap}.filter-btn{background:var(--surface);border:1px solid var(--border);color:var(--text-muted);font-size:.78rem;font-weight:500;font-family:var(--font-sans);padding:.5rem .85rem;border-radius:20px;cursor:pointer;min-height:44px;display:inline-flex;align-items:center;text-decoration:none;transition:background .25s ease,border-color .25s ease,color .25s ease,box-shadow .25s ease}.filter-btn:hover{border-color:var(--accent);color:var(--accent)}.filter-btn.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);box-shadow:0 2px 8px #0000000f}.empty-state{max-width:900px;margin:0 auto;text-align:center;padding:4rem 2rem}.empty-state__icon{font-size:2.5rem;margin-bottom:1rem;color:var(--accent)}.empty-state__title{font-family:var(--font-serif);font-size:1.15rem;font-weight:700;color:var(--text);margin-bottom:.5rem}.empty-state__text{font-size:.9rem;color:var(--text-muted)}@media (max-width: 768px){.section-intro{padding-left:1.25rem;padding-right:1.25rem}}@media (max-width: 480px){.section-intro{padding-top:2rem}.section-intro__inner{gap:1rem;padding-bottom:1.25rem}.section-intro__heading{font-size:1.1rem}.filter-group{width:100%;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none;padding-bottom:.25rem}.filter-group::-webkit-scrollbar{display:none}.filter-btn{white-space:nowrap;min-height:40px;font-size:.75rem;padding:.4rem .75rem}.empty-state{padding:3rem 1.25rem}}.ccard{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .3s ease,transform .3s ease,border-color .3s ease;position:relative;text-decoration:none;color:inherit}.ccard:hover{box-shadow:0 8px 32px #0000001a;border-color:var(--border);transform:translateY(-2px)}@supports (color: color-mix(in srgb,red 50%,blue)){.ccard:hover{box-shadow:0 8px 32px color-mix(in srgb,var(--accent) 12%,transparent);border-color:color-mix(in srgb,var(--accent) 25%,transparent)}}.ccard:before{content:"";position:absolute;top:0;left:0;width:3px;height:100%;background:var(--accent);opacity:0;transition:opacity .3s ease}.ccard:hover:before{opacity:1}.ccard__img-wrap{aspect-ratio:16/9;overflow:hidden;background:var(--border-light);position:relative}.ccard__img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease;filter:grayscale(10%)}.ccard:hover .ccard__img{transform:scale(1.04)}.ccard__badge{position:absolute;top:.6rem;right:.6rem;font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:.2rem .55rem;border-radius:2px;backdrop-filter:blur(4px)}.ccard__badge--active{background:var(--accent);color:#fff}.ccard__badge--paused{background:#b48c28d9;color:#fff}.ccard__badge--closed{background:#1c1b198c;color:#ffffffb3}.ccard__body{padding:1rem 1.1rem 1.2rem;flex:1;display:flex;flex-direction:column;gap:.35rem}.ccard__system{font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}.ccard__title{font-family:var(--font-serif);font-size:.9375rem;font-weight:700;color:var(--text);line-height:1.3}.ccard__setting{font-size:.8rem;color:var(--text-subtle);display:flex;align-items:center;gap:.3rem}.ccard__setting:before{font-family:"Font Awesome 6 Free";font-weight:900;content:"";font-size:.7rem;color:var(--accent)}.ccard__desc{font-size:.8125rem;color:var(--text-muted);line-height:1.6;flex:1;margin-top:.2rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.ccard__footer{display:flex;align-items:center;justify-content:space-between;margin-top:.85rem;padding-top:.75rem;border-top:1px solid var(--border-light)}.ccard__sessions{font-size:.78rem;color:var(--text-subtle);display:flex;align-items:center;gap:.3rem}.ccard__cta{font-size:.8rem;font-weight:500;color:var(--accent);display:flex;align-items:center;gap:.3rem;transition:gap .25s ease,transform .25s ease}.ccard:hover .ccard__cta{gap:.55rem}.ccard__cta:after{content:"→"}.ccard__tags{display:flex;gap:.35rem;flex-wrap:wrap;margin-top:.3rem}.ccard__tag{font-size:.7rem;color:var(--text-subtle);background:var(--border-light);padding:.15rem .5rem;border-radius:3px}.ccard__date{font-size:.78rem;color:var(--text-subtle)}.ccard__stack{display:flex;gap:.35rem;flex-wrap:wrap;margin-top:.3rem}.ccard__tech{font-size:.7rem;color:var(--text-subtle);background:var(--border-light);padding:.15rem .5rem;border-radius:3px;font-family:var(--font-sans)}.ccard__tag-cat{font-size:.78rem;color:var(--text-subtle)}.ccard__badge--done{background:#2a6b4ad9;color:#fff}.ccard__badge--wip{background:#e65100d9;color:#fff}.ccard__badge--archived{background:#1c1b198c;color:#ffffffb3}.ccard__sessions:before{font-family:"Font Awesome 6 Free";font-weight:900;font-size:.7rem;color:var(--accent)}[data-section=dnd] .ccard__sessions:before{content:""}[data-section=vtm] .ccard__sessions:before{content:""}[data-section=htr] .ccard__sessions:before{content:""}[data-section=wla] .ccard__sessions:before{content:""}@media (max-width: 480px){.ccard__body{padding:.85rem 1rem 1rem}.ccard__title{font-size:.875rem}.ccard__desc{-webkit-line-clamp:2}.ccard__footer{margin-top:.65rem;padding-top:.6rem}}.content-section{background:var(--bg);padding:2rem 2rem 4rem}.content-grid{max-width:900px;margin:0 auto;display:grid;gap:1.25rem}.content-grid--3col{grid-template-columns:repeat(3,1fr)}.content-grid--2col{grid-template-columns:repeat(2,1fr)}@media (max-width: 768px){.content-grid--3col{grid-template-columns:repeat(2,1fr)}.content-grid--2col{grid-template-columns:1fr}.content-section{padding-left:1.25rem;padding-right:1.25rem}}@media (max-width: 480px){.content-grid--3col{grid-template-columns:1fr}.content-section{padding:1.5rem 1rem 3rem}.content-grid{gap:1rem}}