.cat{grid-template-columns:240px 1fr;align-items:start;gap:56px;margin-top:64px;display:grid}.areas{gap:4px;display:grid;position:sticky;top:96px}.areas button{text-align:left;font:600 16px var(--f-h);color:var(--ink2);cursor:pointer;background:0 0;border:0;border-radius:14px;justify-content:space-between;align-items:center;padding:12px 16px;transition:background .25s,color .25s;display:flex}.areas button small{font:500 13px var(--f-b);color:var(--ink3)}.areas button:hover{color:var(--ink)}.areas button[aria-pressed=true]{background:var(--surface);color:var(--ink);box-shadow:0 0 0 1px var(--line)}.flist{border-top:1px solid var(--line);display:grid}.fr{border-bottom:1px solid var(--line);animation:in .6s var(--ease) both;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) auto;align-items:baseline;gap:8px 32px;padding:20px 4px;display:grid}.fr h4{font:600 18px var(--f-h);letter-spacing:-.02em}.fr p{color:var(--ink2);font-size:15px}.tag{font:600 11px var(--f-b);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;border-radius:99px;padding:3px 10px}.tag.new{background:var(--sun);color:var(--on-sun)}.tag.soon{box-shadow:inset 0 0 0 1px var(--line);color:var(--ink3);background:0 0}.tag.live{color:var(--accent)}@keyframes in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media (max-width:1000px){.cat{grid-template-columns:1fr}.areas{grid-template-columns:repeat(3,1fr);position:static}.areas button small{display:none}.fr{grid-template-columns:1fr auto}.fr p{grid-area:2/1/auto/-1}}@media (max-width:600px){.areas{grid-template-columns:repeat(2,1fr)}}
