.playground-directory{--playground-ink:#172554;--playground-muted:#52606f;--playground-line:#d9e1eb;--playground-blue:#2949fd;max-width:1120px;color:var(--playground-ink);margin:0 auto;padding:clamp(3.5rem,8vw,7rem) 1.5rem clamp(5rem,10vw,8rem);font-family:Proxima Nova,Georgia,sans-serif}.playground-directory__intro{max-width:710px;margin-bottom:clamp(3.5rem,7vw,5.5rem)}.playground-directory__eyebrow,.playground-category__label,.playground-tile__meta{color:var(--playground-blue);letter-spacing:.14em;text-transform:uppercase;margin:0;font-size:.75rem;font-weight:700;line-height:1.2}.playground-directory h1{color:var(--playground-ink);letter-spacing:-.06em;margin:.7rem 0 1.25rem;font-size:clamp(3rem,7vw,5.5rem);line-height:.92}.playground-directory__lede{max-width:610px;color:var(--playground-muted);margin:0;font-size:clamp(1.125rem,2vw,1.35rem);line-height:1.55}.playground-category+.playground-category{margin-top:5rem}.playground-category__heading{justify-content:space-between;align-items:end;gap:2rem;margin-bottom:1.5rem;display:flex}.playground-category__heading h2{color:var(--playground-ink);letter-spacing:-.035em;margin:.45rem 0 0;font-size:clamp(1.8rem,4vw,2.5rem);line-height:1}.playground-category__heading>p{max-width:280px;color:var(--playground-muted);margin:0;line-height:1.45}.playground-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;display:grid}.playground-tile{border:1px solid var(--playground-line);min-height:430px;color:inherit;background:#fff;border-radius:1.25rem;flex-direction:column;text-decoration:none;transition:border-color .18s,box-shadow .18s,transform .18s;display:flex;overflow:hidden}.playground-tile:hover{border-color:#a9b8ff;transform:translateY(-5px);box-shadow:0 20px 44px #17255421}.playground-tile:focus-visible{outline:3px solid var(--playground-blue);outline-offset:4px}.playground-tile__preview{place-items:center;min-height:230px;display:grid;position:relative;overflow:hidden}.playground-tile__preview--gradients{background:linear-gradient(135deg,#ffdd9e 0%,#ff91b6 45%,#7669ff 100%)}.playground-tile__preview--gradients span{filter:blur(1px);mix-blend-mode:screen;border-radius:999px;position:absolute}.playground-tile__preview--gradients span:first-child{background:#0ed6d3;width:65%;height:130%;transform:translate(-33%,20%)rotate(31deg)}.playground-tile__preview--gradients span:nth-child(2){background:#1943d5;width:44%;height:80%;transform:translate(55%,-28%)}.playground-tile__preview--gradients span:nth-child(3){background:#ff5e61;width:34%;height:68%;transform:translate(-55%,-35%)}.playground-tile__preview--clip-paths{background:#eff4ff}.playground-tile__preview--juice-js{background:#111c3c}.playground-tile__juice-trail{background:#526bbf;border-radius:999px;width:65%;height:10px}.playground-tile__juice-orb{aspect-ratio:1;background:radial-gradient(circle at 30% 28%,#bfd0ff,#2949fd 58%,#172554);border-radius:50%;width:70px;position:absolute;transform:translate(65%);box-shadow:0 14px 30px #2949fd99}.playground-tile__shape{aspect-ratio:1;clip-path:polygon(50% 0%,94% 25%,82% 84%,26% 100%,4% 43%);background:linear-gradient(145deg,#3158fa,#1b2d92);width:150px;transition:transform .22s;box-shadow:18px 20px #2949fd1f}.playground-tile:hover .playground-tile__shape{transform:rotate(8deg)scale(1.05)}.playground-tile__point{aspect-ratio:1;background:#fff;border:3px solid #2949fd;border-radius:50%;width:12px;position:absolute}.playground-tile__point--one{transform:translate(-65px,-72px)}.playground-tile__point--two{transform:translate(70px,-33px)}.playground-tile__point--three{transform:translate(29px,82px)}.playground-tile__placeholder{font-size:5rem;font-weight:700}.playground-tile__body{flex-direction:column;flex:1;min-height:200px;padding:1.5rem 1.6rem 1.7rem;display:flex}.playground-tile__meta{justify-content:space-between;align-items:center;display:flex}.playground-tile__arrow{font-size:1.35rem;line-height:.8;transition:transform .18s}.playground-tile:hover .playground-tile__arrow{transform:translate(3px,-3px)}.playground-tile h3{color:var(--playground-ink);margin:.75rem 0 .6rem;font-size:1.6rem;line-height:1.1}.playground-tile p{color:var(--playground-muted);margin:0;line-height:1.5}.playground-tile__tags{flex-wrap:wrap;gap:.45rem;margin:auto 0 0;padding:1.35rem 0 0;list-style:none;display:flex}.playground-tile__tags li{color:#40516a;background:#edf1f7;border-radius:999px;padding:.32rem .55rem;font-size:.75rem;font-weight:700}@media (width<=640px){.playground-category__heading{display:block}.playground-category__heading>p{margin-top:.85rem}.playground-grid{grid-template-columns:1fr}.playground-tile{min-height:390px}.playground-tile__preview{min-height:205px}}