.petme-app-shell{background:var(--color-primary);min-height:100vh;color:var(--color-inverse-primary);justify-content:center;align-items:flex-start;display:flex}.petme-app-shell__sidebar{flex:none;align-self:flex-start;height:100vh;display:none;position:sticky;top:0}@media (min-width:1024px){.petme-app-shell__sidebar{width:240px;display:block}}@media (min-width:1440px){.petme-app-shell__sidebar{width:280px}}.petme-app-column{background:var(--color-primary);flex:0 auto;width:100%;max-width:100%;min-height:100vh}@media (min-width:640px){.petme-app-column{width:100%;max-width:600px}}@media (min-width:1024px){.petme-app-column{max-width:480px}}.petme-app-shell__rail{flex:none;align-self:flex-start;height:100vh;display:none;position:sticky;top:0}@media (min-width:1440px){.petme-app-shell__rail{width:320px;display:block}}
.petme-card{padding:var(--s3);background:var(--color-primary-container);color:var(--color-inverse-primary);border:1.5px solid var(--color-secondary-container);border-radius:var(--r-content);transition:border-color var(--motion-short) var(--curve-out);display:block}.petme-card--padded{padding:var(--s4)}.petme-card--interactive{cursor:pointer}@media (hover:hover){.petme-card--interactive:hover{border-color:color-mix(in srgb, var(--color-inverse-primary) 16%, var(--color-secondary-container))}}.petme-card--interactive:focus{outline:none}.petme-card--interactive:focus-visible{outline:2px solid var(--cta);outline-offset:2px}