/* The home reads as a channel directory rather than a matrix of identical tiles. */
.hero{gap:42px;padding-top:7vh}
.channel-directory{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:5vw;border-top:1px solid var(--line);padding-top:22px;margin-top:12px;width:100%;align-items:start}
.channel-index{margin:0 0 17px;font-size:10px;font-weight:600;letter-spacing:.12em;color:#777}
.channel-links{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}
.channel-section:nth-child(2) .channel-links{grid-template-columns:1fr}
.channel-directory a{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:28px;font-size:15px}
.channel-directory a>span:last-child{transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.channel-directory a:hover>span:last-child{transform:translateX(4px)}
.channel-directory a:focus-visible{outline:1px solid currentColor;outline-offset:5px}
.channel-community .discord-entry{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.discord-entry strong{font:500 clamp(28px,3.1vw,44px)/1.1 "Avenir Next","Arial",sans-serif;letter-spacing:-.05em}
.discord-action{display:flex;align-items:center;gap:20px;font-size:12px}
.event-status{font-size:12px;line-height:1.5;letter-spacing:.02em;color:#555}
.recap-cover img{object-fit:cover;object-position:50% 45%}
.event-recap{margin-top:24px;border-top:1px solid var(--line)}
.event-recap summary{display:flex;align-items:center;justify-content:space-between;gap:20px;list-style:none;cursor:pointer;padding:16px 0;font-size:14px}
.event-recap summary::-webkit-details-marker{display:none}
.event-recap[open] summary>span:last-child{transform:rotate(45deg)}
.recap-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px 14px;padding:8px 0 20px}
.recap-grid figure{margin:0;min-width:0}
.recap-photo{display:block;padding:0;border:0;background:transparent;width:100%;cursor:zoom-in;overflow:hidden}
.recap-photo img{display:block;width:100%;height:auto;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.recap-photo:hover img{transform:scale(1.025)}
.recap-grid figcaption{display:flex;gap:9px;font-size:10px;color:#666;line-height:1.6;padding-top:8px}
#recap-lightbox{width:min(900px,calc(100vw - 24px));padding:16px;background:#fff}
#recap-lightbox img{display:block;width:100%;height:auto;max-height:72dvh;object-fit:contain}
#recap-lightbox .recap-close{display:block;margin:0 0 12px auto}
#recap-lightbox p{font-size:12px;margin:12px 0 0}
@media(max-width:760px){
 .hero{gap:34px;padding-top:7vh;padding-bottom:28px}
 .channel-directory{grid-template-columns:1.2fr 1fr;gap:22px 24px;padding-top:18px;margin-top:8px}
 .channel-links{grid-template-columns:1fr;gap:4px}
 .channel-directory a{font-size:14px;min-height:29px}
 .channel-index{margin-bottom:10px;font-size:9px}
 .channel-community{grid-column:1/-1;border-top:1px solid #ddd;padding-top:16px}
 .channel-community .channel-index{display:none}
 .channel-community .discord-entry{flex-direction:row;align-items:center;justify-content:space-between;gap:15px}
 .discord-entry strong{font-size:26px}
 .discord-action{font-size:12px;gap:18px}
}
@media(prefers-reduced-motion:reduce){.channel-directory a>span:last-child,.recap-photo img{transition:none;transform:none!important}}
html[data-opening=pending] .hero .channel-pills,html[data-opening=playing] .hero .channel-pills,html[data-opening=revealing] .hero .channel-pills{opacity:0}
@media(max-width:760px){.hero{min-height:0;padding-bottom:38px}}
