/* Homepage action cards (Apple Store shelf style). Only used by index.html. */
.shelf{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:1180px;margin:10px auto 0;padding:14px 4px 26px;text-align:left}
.acard{position:relative;display:block;aspect-ratio:3/4;border-radius:22px;overflow:hidden;background:#0b0b0e;border:1px solid rgba(225,230,240,.14);color:#f5f5f7;font:inherit;text-align:left;padding:0;cursor:pointer;text-decoration:none!important;
 box-shadow:0 4px 14px rgba(0,0,0,.35);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.acard picture,.acard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.acard::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.72) 30%,rgba(0,0,0,.15) 58%,transparent 75%)}
.acard:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 22px 50px rgba(0,0,0,.55)}
.acard:focus-visible,.acard:focus-within{outline:none;box-shadow:0 0 0 3px #2997ff,0 22px 50px rgba(0,0,0,.55)}
.acard[disabled]{cursor:progress;opacity:.85}
.ac-t{position:relative;z-index:2;display:flex;flex-direction:column;padding:24px 22px}
.ac-e{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#ffb057}
.ac-h{font-size:24px;line-height:1.12;font-weight:700;letter-spacing:-.02em;margin:6px 0 6px;color:#fff;cursor:inherit}
.ac-s{font-size:14px;line-height:1.4;color:#d2d2d7}
.ac-c{margin-top:12px;font-size:15px;font-weight:500;color:#64b5ff}
.ac-f{display:flex;gap:6px;margin-top:12px}.ac-f input{flex:1;min-width:0;font:inherit;font-size:15px;padding:8px 14px;border-radius:980px;border:1px solid rgba(225,230,240,.35);background:rgba(0,0,0,.55);color:#fff;text-transform:uppercase;outline:none}
.ac-f input:focus{border-color:#2997ff}.ac-f input::placeholder{color:#aeaeb2;text-transform:none}
.ac-tv{margin-top:10px;align-self:flex-start;background:none;border:0;padding:2px 0;font:inherit;font-size:14px;color:#64b5ff;cursor:pointer}.ac-tv:hover{text-decoration:underline}
#joinCard{cursor:default}
.below{max-width:560px;margin:6px auto 0;text-align:center}.below details.own{display:inline-block;text-align:left}.below details.own input{font:inherit;padding:10px 16px;border-radius:980px;border:1px solid rgba(225,230,240,.3);background:rgba(0,0,0,.4);color:#fff;width:100%}
.glinks{font-size:15px;margin:10px 0 0}
@media(max-width:1060px){.shelf{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:16px;margin:10px -22px 0;padding:14px 22px 26px;scroll-padding:0 22px;scrollbar-width:none;-webkit-overflow-scrolling:touch}.shelf::-webkit-scrollbar{display:none}
 .acard{flex:0 0 min(300px,78vw);scroll-snap-align:start}.acard:hover{transform:translateY(-3px)}}
@media(max-width:600px){.shelf{margin:10px -20px 0;padding:12px 20px 22px;scroll-padding:0 20px}.ac-h{font-size:22px}}
@media(prefers-reduced-motion:reduce){.acard,.acard:hover{transition:none;transform:none}}
#create.acard,#solo.acard{width:auto;padding:0;margin:0;font-size:inherit}@media(max-width:1060px){#create.acard,#solo.acard{width:auto}}
.acard{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch}.ac-t{width:100%;box-sizing:border-box}