/* Meloa 브랜드 — apps/mobile/lib/theme/dawn.ts 의 Dawn 팔레트(밝은 웜 페이퍼).
 * 액센트는 오커(#9A612F) 단일 시그니처, 글자는 plum 잉크(#3A2E4D).
 * 톤 변수는 --tone-bg / --tone-ink 로 전역 --ink 와 이름을 분리한다 — 같은 이름이면 카드에
 * 인라인으로 준 톤 색이 카드 안 본문(.ink)까지 덮어쓴다. */
:root { --accent: #9A612F; --accent-deep: #86522A; --ink: #3A2E4D; --ink-soft: #6F617F;
        --card: #FFFDF9; --card-alt: #FFF6EA; }

body { background: var(--card); color: var(--ink); }
.antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.ink { color: var(--ink); }
.ink-soft { color: var(--ink-soft); }
.sec-cream { background: var(--card); }
/* 앱 홈 그라디언트(dawn.ts gradients.home) */
.sec-alt { background: linear-gradient(180deg, #FFF7EC 0%, #FDEBD8 45%, #F6D8D4 80%, #E8DBE8 100%); }

.brand-fill { background: var(--accent); }
.brand-fill:hover { background: var(--accent-deep); }
.brand-wash { background: linear-gradient(135deg, #FFF7EC 0%, #FDEBD8 45%, #E8DBE8 100%); }
.brand-glow { background: radial-gradient(closest-side, rgba(154, 97, 47, .30), rgba(201, 184, 219, .25), transparent); }
.brand-blob-a { background: rgba(232, 180, 184, .35); }
.brand-blob-b { background: rgba(184, 206, 180, .35); }

.tone-ico { background: var(--tone-bg); color: var(--tone-ink); }
.tone-chip { background: color-mix(in srgb, var(--tone-bg) 55%, white); color: var(--tone-ink); }
.tone-border { border-color: color-mix(in srgb, var(--tone-bg) 70%, white); }
.avatar { box-shadow: 0 0 0 4px #fff, 0 0 0 6px var(--tone-bg); }

/* 반드시 `@layer base` 안에 둔다. 이 파일의 나머지 규칙은 레이어 밖이라 site.css 의
 * `@layer utilities` 를 명시도와 무관하게 전부 이긴다 — img{height:auto} 가 레이어 밖이면
 * .h-full·.w-24 같은 크기 유틸리티를 무력화한다(vibelit 에서 히어로가 900px→802px 로 줄었다). */
@layer base {
  img, video { max-width: 100%; height: auto; display: block; }
}

@keyframes fade-in-up { from { opacity: 0; transform: translateY(1rem); } to { opacity: 1; transform: none; } }
.animate-fade-in-up { animation: fade-in-up .6s ease-out both; }

/* 히어로 배지의 '곧 출시' 점 — site.css 빌드에 amber 계열이 없어 여기서 정의한다 */
.dot { background: #E8CFA3; }
.dot-ping { background: #E8CFA3; }
