카드를 걷어내고 구조를 비대칭으로

'전체적인 레이아웃이나 카드가 너무 전형적이지 않나요'라는 지적.
정확했다. 유리라는 재질만 바뀌었을 뿐 구조는 카드 나열 그대로였다.
우리 규칙이 이미 그걸 금지하고 있었다.

  layout.md: 벤토는 더 이상 차별화가 아니라 새 기본값이다
  design-taste 4.4: 카드는 elevation 이 진짜 위계를 나를 때만

바꾼 것
- 수치: 벤토 카드 -> 조판. 큰 수치 둘이 왼쪽을 차지하고 나머지는
  오른쪽 열에 목록으로 흐른다. 상자 없음
- 규칙: 2열 카드 -> 어긋난 목록. 홀수 항목은 근거가 한 칸 더 밀린다
- 프리플라이트: 카드 -> 로그. 세로선 하나가 형식을 만든다
- 설치 명령·재료 타일: 액자 제거
- 섹션 제목이 본문 정렬선보다 왼쪽으로 나온다. 같은 양을 전체에서 반복

유리 카드 29개 -> 5개. 정말 떠 있어야 하는 것에만 남겼다.
페이지의 수치와 프리플라이트 로그에도 그대로 적었다.

apps/site/src/components/Materials.astro

@@ -23,11 +23,7 @@ const { c } = Astro.props;
       {
         c.tiles.map((t, i) => (
           <li class="tile reveal" style={`--reveal-delay:${i * 80}ms`}>
-            <div class="shell lift">
-              <div class="core">
-                <div class={`swatch swatch-${t.id}`} aria-hidden="true"></div>
-              </div>
-            </div>
+            <div class={`swatch swatch-${t.id}`} aria-hidden="true"></div>
             <h3 class="tile-name">{t.name}</h3>
             <p class="tile-how muted">{t.how}</p>
             <p class="tile-cost mono">{t.cost}</p>
@@ -131,12 +127,12 @@ const { c } = Astro.props;
   .tile:nth-child(1) .swatch { aspect-ratio: 16 / 11; }
   .tile:nth-child(n + 2) .swatch { aspect-ratio: 16 / 6; }
   .tile { display: grid; gap: var(--space-2); align-content: start; }
-  .tile .shell { box-shadow: var(--glass-hi), var(--shadow-2); }
-  .tile .core { overflow: hidden; }
 
   /* 필터를 먹일 대상. 같은 도형에 서로 다른 재질을 입힌다 */
   .swatch {
     aspect-ratio: 4 / 3;
+    border-radius: var(--radius-md);
+    overflow: hidden;
     background:
       repeating-linear-gradient(
         58deg,