/* 앱 공통 규약: 이 앱은 다크 전용 디자인이다.
   사이트가 라이트여도 다크 팔레트를 고정하고, 라이트 분기는 두지 않는다. */
:root[data-nb-theme="dark"],
:root[data-nb-theme="light"] {
  color-scheme: dark;
}

/* 사이트 헤더/푸터가 iframe 밖에 있으므로 앱은 iframe 뷰포트 기준 100vh 를 쓴다. */
html,
body,
#root {
  height: 100%;
  margin: 0;
}

body {
  font-family: 'Fredoka One', 'Apple SD Gothic Neo', 'Malgun Gothic', cursive, sans-serif;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  background: linear-gradient(135deg, #581c87 0%, #312e81 100%);
}

/* 게임 배경은 body 그라디언트를 그대로 쓴다 (레벨 선택 화면도 동일 톤) */
#root {
  background: linear-gradient(135deg, #581c87 0%, #312e81 100%);
}

/* 컨테이너 쿼리 단위 — 보드 크기에 비례해 플로팅 점수 크기를 조절한다.
   지원되지 않는 브라우저에서는 아래 fallback(clamp)이 적용된다. */
.board-scope {
  container-type: inline-size;
}