/* 새 부품이 쓰는 바닥. 옛 화면 CSS 와 이름이 겹치지 않게 한다.
   앞으로 새로 입히는 화면은 여기 이름만 쓴다 — 색을 직접 적지 않는다.
   그래야 나중에 결을 바꿀 때 이 파일 하나만 고치면 된다. */

:root {
  /* ---------- 뜻이 있는 색 ---------- */
  --강조:     #e8c07a;   /* 금색 — 중요한 숫자 · 누르는 것 */
  --오름:     #e59a9a;   /* 값이 올랐다 */
  --내림:     #8fd19e;   /* 값이 내렸다 */
  --만든것:   #b9a5e8;   /* 사지 않고 만든 것 */
  --흐린글:   #aeb4bf;
  --더흐린글: #767d89;

  /* ---------- 바탕과 판 ---------- */
  --바탕:     #12141a;   /* 가장 아래 */
  --판:       #1a1e27;   /* 입력칸 · 얕은 판 */
  --판위:     #222733;   /* 그 위에 얹는 것 */
  --테두리:   #2b313d;
  --테두리진: #3a4250;
  --글:       #ffffff;
  --글보통:   #dfe1e5;

  /* ---------- 알림 ---------- */
  --나쁨:     #e59a9a;
  --나쁨바탕: rgba(200,80,80,.14);
  --나쁨테:   rgba(200,80,80,.34);
  --좋음:     #8fd19e;

  /* ---------- 글자 크기 ---------- */
  --큰제목:   30px;
  --제목:     21px;
  --글자:     15.5px;
  --작은글:   13px;
  --아주작은: 12px;

  /* ---------- 사이와 모서리 ---------- */
  --틈:       12px;
  --둥글:     9px;
  --많이둥글: 14px;

  /* ---------- 누르는 것의 크기 ----------
     핸드폰에서 손가락으로 누르려면 44px 아래로 내려가면 안 된다 */
  --누름높이: 50px;
}