.puppils-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:24px;display:grid}.puppil-grid-item{all:unset;box-sizing:border-box;cursor:pointer;border-radius:var(--border-radius);flex-direction:column;align-items:center;gap:10px;display:flex}.puppil-grid-item:focus-visible{outline:2px solid var(--glow-color);outline-offset:4px}.puppil-grid-item.is-active{opacity:0;pointer-events:none}.puppil-grid-item .puppil-grid-photo{aspect-ratio:1;object-fit:cover;border-radius:var(--border-radius);width:100%;box-shadow:var(--shadow);transition:transform .25s,box-shadow .25s}.puppil-grid-item .puppil-grid-name{color:var(--text-h);font-weight:500}.puppil-grid-item:hover .puppil-grid-photo,.puppil-grid-item:focus-visible .puppil-grid-photo{box-shadow:0 0 20px var(--glow-color);transform:scale(1.05)}.puppil-overlay-backdrop{z-index:100;background:0 0;transition:background-color .45s;position:fixed;inset:0}.puppil-overlay-backdrop.entering,.puppil-overlay-backdrop.open,.puppil-overlay-backdrop.closing{background-color:#000000bf}.puppil-overlay-photo{z-index:101;object-fit:cover;border-radius:var(--border-radius);margin:0;transition:top .5s cubic-bezier(.22,1,.36,1),left .5s cubic-bezier(.22,1,.36,1),width .5s cubic-bezier(.22,1,.36,1),height .5s cubic-bezier(.22,1,.36,1);position:fixed;box-shadow:0 0 40px #0009}.puppil-overlay-photo.open{width:40vw;height:70vh;top:15vh;left:6vw}@media (max-width:800px){.puppil-overlay-photo.open{width:80vw;height:38vh;top:6vh;left:10vw}}.puppil-overlay-opinion{z-index:101;opacity:0;pointer-events:none;flex-direction:column;height:70vh;transition:opacity .4s .15s,transform .4s .15s;display:flex;position:fixed;top:15vh;left:50vw;right:6vw;overflow-y:auto;transform:translate(30px)}.puppil-overlay-opinion.open{opacity:1;pointer-events:auto;transform:translate(0)}@media (max-width:800px){.puppil-overlay-opinion{height:48vh;top:46vh;left:6vw;right:6vw}}.puppil-overlay-close{all:unset;cursor:pointer;text-align:center;color:#000;border-radius:50%;align-self:flex-end;width:32px;height:32px;font-size:22px;line-height:32px}.puppil-overlay-close:hover,.puppil-overlay-close:focus-visible{background-color:#00000014}