/* ══════════════════════════════════════════════════════════════════
   조각-상단.css — 조각-상단.html 전용 보강 규칙 (O2)
   규칙: hex·신규 radius·신규 shadow 리터럴 0건. 색·둥글기·그림자는 var(--dm-*)만.
        치수/여백은 대문.css --dm-sp-* 토큰 또는 원본(landing 상단) 등재 치수만.
   ══════════════════════════════════════════════════════════════════ */

/* 상단 헤더 — 가운데 정렬 스택 (원본 landing 상단이 중앙 정렬) */
.dm-top{ align-items:center; text-align:center; }
.dm-top-logo{ margin-top:var(--dm-sp-7); }
.dm-top-stack{ align-items:center; gap:var(--dm-sp-2); }

/* 옴니박스 — Main.dc.html 검색 pill 폭은 원본 상단값(min(560px,92vw)) 유지 */
.dm-omni{ width:min(560px,92vw); padding-right:var(--dm-sp-1); }
/* 골드 원형 전송 버튼 — 원본 omni button 36px 원형, 색은 .dm-btn-gold 상속 */
.dm-omni-go{
  width:36px; height:36px; min-width:36px; padding:0; flex:none;
  font-size:16px; font-weight:800;
}

/* 타일 5 — ButlerHome 둥근 사각 아이콘 + 아래 라벨, 원본 상단 gap 18px */
.dm-tiles{
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:var(--dm-sp-8); margin-top:var(--dm-sp-7);
}
.dm-tiles .dm-tile{
  flex:none; min-height:0; gap:var(--dm-sp-3);
  text-decoration:none; color:var(--dm-muted);
}
.dm-tiles .dm-icon{
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.dm-tiles .dm-tile:hover .dm-icon{ transform:translateY(-2px); }
.dm-tiles .dm-tile:hover{ color:var(--dm-ink-strong); }

/* "더보기" 타일 — 원본 .tile.add 파선 테두리 의미 유지 */
.dm-icon-add{
  background:var(--dm-surface);
  border:1px dashed var(--dm-line);
  color:var(--dm-muted);
}