Add fitted preview on playground panel

packages/base/cards-grid.gts

@@ -213,9 +213,9 @@ class Isolated extends Component<typeof CardsGrid> {
         letter-spacing: 0.21px;
       }
       .cards-grid {
-        --grid-card-min-width: 11.125rem;
-        --grid-card-max-width: 1fr;
-        --grid-card-height: 15.125rem;
+        --grid-card-min-width: 10.625rem; /* 170px */
+        --grid-card-max-width: 10.625rem; /* 170px */
+        --grid-card-height: 15.625rem; /* 250px */
 
         padding: var(--cards-grid-padding-top) 0 0 var(--boxel-sp-sm);
 

packages/base/default-templates/fitted.gts

@@ -1,7 +1,5 @@
 import GlimmerComponent from '@glimmer/component';
 import type { CardContext, BaseDef, CardDef } from '../card-api';
-// @ts-ignore no types
-import cssUrl from 'ember-css-url';
 import { cardTypeDisplayName, cardTypeIcon } from '@cardstack/runtime-common';
 import { BasicFitted } from '@cardstack/boxel-ui/components';
 

packages/base/field-component.gts

@@ -306,7 +306,7 @@ export function getBoxComponent(
           works if we use up all the space horizontally and vertically that is available
           to the card since some of our queries are height queries
         */
-        height: 58px;
+        height: 65px;
         container-name: fitted-card;
         container-type: size;
         overflow: hidden;