:root{
  /* Color */
  --theme1:#91d3ca;
  --theme2:#74b3de;
  --theme3:#5db7ab;
  --background:#ffffff;
  --surface:#ffffff;
  --subtitle:#243634;
  --text-light:#64807a;
  --ye-jp:#86b2df;
  --yllw:#fdf5c4;

  /* Radius */
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:16px;
  --radius-xl:24px;

  /* Shadow */
  --shadow-card:0 8px 28px rgba(0,0,0,.08);

  /* Font */
  --title:22px;
  --subtitle:16px;
  --body:14px;
  --small:12px;
  --caption:10px;

  /* Spacing */
  --gap:12px;
  --page-padding: 16px;

  /* BG Gradient */
  --bg-gradient1: linear-gradient(
    180deg,
    #91d3ca 0%,
    #a8ddd6 15vh,
    #dff2ef 30vh,
    #ffffff 55vh
  );


--bg-gradient2: linear-gradient(
  180deg,
  #74b3de 0%,
  #8cc0e5 15vh,
  #b2d8f2 30vh,
  #d8ebf9 45vh,
  #edf6fc 60vh,
  #ffffff 100%
);
}